javascript - 在 Jquery 中，如何让一个 div 从 A 平滑滑落到 B 以便另一个 div 在 A 中淡入淡出？

Question

我试过这个：

$('#hidden_div').fadeIn();

但是我想要顺利滑下的 div 只是将自己传送到下一个位置。（我希望它顺利滑到它上面）然后这个：

$('#sliding_div').animate({marginTop: '+=400px'},1000);
$('#hidden_div').fadeIn();

但是我没有得到正确的效果。你怎么能做到这一点？提前致谢。

Answer 1

$('#sliding_div').animate({marginTop: '+=400px', opacity:1},1000);

在此之前，将 #sliding_div 不透明度设置为 0

Answer 2

这是一个更流畅的版本：http: //jsfiddle.net/W8AtL/4/

This fixes the jump from it being marginTop.

Answer 3

如果我理解了你想要的效果，你需要在完成fadeIn()后的第二个 div animate()。您可以使用 的callback参数animate()来执行此操作：

$('#sliding_div').animate(
    { marginTop: '+=400px' },
    1000,
    function() {
        $('#hidden_div').fadeIn();
    }
);