单击另一个时如何更改div样式

Question

我会在单击时更改div css样式，然后在单击另一个时更改为主要状态。 我使用了这段代码，但它只是在点击另一个div时重新更改它，这里的代码正在尝试：

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

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

});

Answer 1

您可能正在寻找toggle（）函数：

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

你需要jQuery UI动画颜色？

小提琴

编辑：

您可能仍在寻找toggle（）函数，但在单击另一个div时为一个div设置动画，请停止使用this关键字并定位您尝试设置动画的div：

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

});​

小提琴

Answer 2

尝试这个：

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

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