Question

代码：

$(document).ready(function() {
    $('.some_class').slideDown(1000).fadeIn(5000);
});

使用上面的那个，我想滑动一个div而fadeIn。上面的那个似乎不起作用。我做错了什么？

Answer 1

这样做：

$(document).ready(function () {
    $('.some_class').stop(true).fadeIn({
        duration: 5000,
        queue: false
    }).css('display', 'none').slideDown(1000);
 });

演示 here

问题是，.fadeIn()和.slideDown()都需要元素display:none;，当其中一个启动它时会移除它并使用不透明度，第二个效果将无法运行，因为display不再是none。

因此，如果您停止动画并在运行最后一个效果之前重新插入显示，则它们将“并排”运行。

万一你想要， here 是带图片的演示

Answer 2

你可以做类似的事情：

$(document).ready(function () {
    $('.some_class').animate({
        "height": "show",
        "marginTop": "show",
        "marginBottom": "show",
        "paddingTop": "show",
        "paddingBottom": "show",
        "opacity": 1
    }, 3000);
});

以下是一个示例：http://jsfiddle.net/sE97R/1/

Answer 3

确保正确加载带有“some_class”类的元素，并且它最初是隐藏的

 $(document).ready(function() {
    $('.some_class').fadeIn(1000).slideDown(1000);
});

这是在JQuery中向下滑动时淡入淡出的正确方法吗？

3 个答案:

演示 here