jquery - 多个并发的 jQuery 效果

Question

我正在尝试将一些精美的 UI 内容应用到我的 Web 应用程序中，并且我想要一个菜单​​，它可以向下滑动并淡入，或者同时向上滑动和淡出

我试过这个...

if($('#Menu').css("display") == "none") {
    $('#Menu').slideDown(250).fadeIn(250);
} else {
    $('#Menu').slideUp(250).fadeOut(250);
}

......它没有工作。只发生一种效果...谁能解释是否可以以这种方式将效果链接在一起，或者提出一种解决方法？

Answer 1

要实现这一点，您需要使用 jQuery 的.animate()函数。像这样的东西；

if ($('#Menu').css('opacity') == 1) {
    $('#Menu').animate({
        opacity: 0,
        height: '0'
    }, 500, function() {
        // animation complete
    });
} else {
    $('#Menu').animate({
        opacity: 1,
        height: '200px'
    }, 500, function() {
        // animation complete
    });
}​

我认为您可以将高度值替换为“切换”以避免输入特定值。但是我没有亲自使用它，所以不能确定。

编辑： “切换”似乎工作正常：http: //jsfiddle.net/RjESG/3/