如何使这个页面过渡流体?

时间:2012-01-20 16:25:47

标签: jquery

我想在页面转换之间创建一个淡出淡出效果。

我使用此代码淡入:

$(window).load(function () {
  $(document.body).fadeIn("fast");
});

此代码淡出:

$(window).unload(function() {
  $(document.body).fadeOut("fast");
});

代码确实有效,但转换不会流畅地执行。如何使褪色更具流动性,使其看起来像是一种自然运动?

2 个答案:

答案 0 :(得分:2)

关于如何做到这一点有各种各样的例子,没有发布CSS和JS代码给你一个例子我将在这里给你一个很好的参考:

http://www.onextrapixel.com/2010/02/23/how-to-use-jquery-to-make-slick-page-transitions/

您所做的与上述示例之间的区别在于,它们是否停止默认链接操作,创建转换,一旦转换完成,它们将恢复默认值(即加载链接)。

在你的情况下,你会在页面卸载时触发,这将被切断,因为它只是页面转换的时刻,你无法控制。

答案 1 :(得分:0)

HTML动画因机器,浏览器和浏览器而异。你能做的最好的事情就是放慢速度。