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
    });
}

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

修改 'toggle'似乎工作得很好：http://jsfiddle.net/RjESG/3/

多个并发jQuery效果

1 个答案: