OSX Snow Leopard 使用 jQuery 开始屏幕页面过渡

Question

有一个关于jQuery页面过渡的非常简单的问题。我想复制我的Mac从启动到显示桌面时所做的过渡。我想为此使用jQuery。有没有人偶然发现了一些冷对我进行重定向的资源？

你可以在这里看到我正在寻找的过渡视频：http://www.youtube.com/watch?v=-I9F4JswFXI

Answer 1

这是使用 CSS3 过渡，但会优雅地回退到其他浏览器。基本上，我们设置了一个整页包装器div，并使不可见且略小。然后，当我们制定.show类时，它将过渡到全大小和完全不透明度。

然后我们在页面加载时触发它，你应该几乎和狮子一模一样。 :)

.CSS

#fullPageWrapper{
    -webkit-transition:all 1s;
    -moz-transition:all 1s;
    -ms-transition:all 1s;
    -o-transition:all 1s;
    transition:all 1s;
    -webkit-transform:scale(0.8);
    -moz-transform:scale(0.8);
    -ms-transform:scale(0.8);
    -o-transform:scale(0.8);
    transform:scale(0.8);
    opacity:0;
}
#fullPageWrapper.show{
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1);
    -o-transform:scale(1);
    transform:scale(1);
    opacity:1;
}

jQuery

$(function(){
     $(window).on('load', function(){
          setTimeout(function(){
              $('#fullPageWrapper').addClass('show');
          },16);         
     });
});

Answer 2

不知道可用的资源。但是您可以使用jQuery Fade（用于隐藏启动屏幕），Load（用于使用AJAX加载图像内容）和Zoom（用于在启动时放大图像）来创建它。

这些链接将帮助您：

http://api.jquery.com/fadeOut/

http://api.jquery.com/load/

如何使用jQuery在页面加载时放大div？