CODEWITHSUNDEEP
javascriptjqueryhtml
Lameen
Lameen

Reputation: 1

How to change div style when click to another

I would to change the div css style when click, then change to it primary status when click to another. i used this code but it just rechange it when click on another div, here the code am trying:

$('.mydiv').click(
function() {

    $(this).stop().animate({
    width:'960px',
    backgroundColor : '#000'
}, 500);
    }, function () {
    $(this).stop().animate({width:'300px', backgroundColor : "green"}, 300);

});

Upvotes: 0

Views: 248

Answers (2)

adeneo
adeneo

Reputation: 318302

You're probably looking for the toggle() function :

$('.mydiv').toggle(function() {
    $(this).stop().animate({
        width: '960px',
        backgroundColor: '#000'
    }, 500);
}, function() {
    $(this).stop().animate({
        width: '300px',
        backgroundColor: "green"
    }, 300);
});​

And you need jQuery UI to animate colors ?

FIDDLE

EDIT:

You're probably still looking for the toggle() function, but to animate one div when clicking on another div, stop using the this keyword and target the div you're trying to animate :

$('#someDiv').toggle(function() {
    $('.mydiv').stop().animate({
        width: '960px',
        backgroundColor: '#000'
    }, 500);
}, function() {
    $('.mydiv').stop().animate({
        width: '300px',
        backgroundColor: "green"
    }, 300);

});​

FIDDLE

Upvotes: 2

PitaJ
PitaJ

Reputation: 15074

Try this:

$('.mydiv').click(function() {

    $(this).stop().animate({
        width:'960px',
        backgroundColor : '#000'
    }, 500, function() {
        $(this).stop().animate({width:'300px', backgroundColor : "green"}, 300);
    });
});

Upvotes: 0

Related Questions