javascript - 如何制作变换动画

Question

我有一个用于我的 HTML 页面的脚本。我想在该脚本中进行以下操作:

1. 显示预加载的 #id 几秒钟，然后淡出；

2. 当 div 正在加载显示的 div 下的主页时，因为我的 opacity 是 0.7 我想转换 nav- bar 一直到浏览器窗口，所以基本上隐藏它并在那个位置转换一个新的 nav-bar。

我希望它发生在预加载页面工作时而不是之后!我想用 nav-bar 动画在 parraler 中显示更多内容。

我创建了脚本，但我迷失了如何定位我的 Action ，我不知道我是否正确地做了任何事情。我制作淡出预加载器。

$(window).load(function(){
    $("#fade").css({opacity: 0.7})
    $("#fade").delay(4000).fadeOut(1000, function() {
        $('#nav-before').transition({ y: '40px' }); //now I want to hide the nav
        //and show the new with id="nav-after"
            //and in parraller with the above to be able to load more contects
        $("#fade").remove(); //when evrything finished kill the div
    });

});

Answer 1

$( "#fade" ).animate({
    opacity: 0.0
  }, 5000, function() {
    // Animation complete.
  });

您可以玩animate。这是引用:jquery.com/animate/