Question

我正在寻找重新定义我的切换功能。现在它切换很好，然而，第一个切换“打开”两个不同的部分 - 这是好的。关闭它们时，我想同时关闭它们，或者至少先关闭它们。此外，除了单击列表之外，我还想关闭它们。

$('#LoginButton').click(function(){
 $('.username').animate({
        width : 'toggle'
 }, 1000, 'swing',function(){ //Set new LoginButton width
    var newWidth = ($('.username').width()); //get new width
    $('#LoginButton').toggleClass('expanded'); //just for rounded corners
    $("#profilesettings").width(newWidth).toggle(300); //new list width animation
 });
});

我目前所拥有的内容：Fiddle

非常感谢任何帮助。谢谢。

Answer 1

您正在使用animate方法的回调函数，当hide元素可见时应调用.username方法，因此动画会在同一时间执行。

$('#LoginButton').click(function () {
    var $username = $('.username'),
        $profile = $('#profilesettings'),
        state = true;

    if ($username.is(':visible')) {
        $profile.hide(1000);
        state = false;
    }
    $username.animate({
        width: 'toggle'
    }, 1000, 'swing', function () {
        if (state) {
            var newWidth = $(this).width();
            $profile.width(newWidth).show(300);
        }
        $('#LoginButton').toggleClass('expanded');
    });
});

http://jsfiddle.net/wxXyM/

jQuery在关闭时更改切换顺序

1 个答案: