javascript - jQuery 一起使用 slideDown 和 replaceWith

Question

我有两个 div：div1 和 div2

我正在尝试实现一种效果，其中 div1 动画为透明并且在它的最后，div2 在它的顶部向下滑动（替换 div1）。

这是我尝试过的（http://jsfiddle.net/RHSgf/4/）：

div1.animate({
   opacity: 0.0
}, 2000, function () {
   $(this).replaceWith(div2.hide().slideDown(2000, 'linear', function () {}));
});

但是在 div1 的动画结束时，div2 并没有那么优雅地向下滑动。

我不知道为什么滑下来这么生涩。感谢您帮助找出正确的方法。

Answer 1

搬出它应该slideDown可以replaceWith工作：

$(this).replaceWith(div2.hide());
div2.slideDown(2000, 'linear');

http://jsfiddle.net/elclanrs/RHSgf/5/

Answer 2

试试这个并根据您的要求调整时间！

<script type="text/javascript">
 $(document).ready(function () 

                      {
                        $("#div2").fadeOut(2000);
                        setTimeout(function () {  $("#div1").slideDown(2000); }, 2000);
                      }
                 );

</script>