一个非常简单带动画的页面预加载JavaScript效果
栏目分类：其他代码发布日期：2014-09-13 来源：互联网浏览次数：次

今天我们要为您展示如何创建CSS动画，SVG和JavaScript的一个非常简单的页面预加载的效果。对于网站，它是至关重要的加载所有或部分资产，这些种预载画面可以是一个创造性的方法，使等待少一点无聊的游客。这个想法本教程是基于看到Fontface忍者的网站上美丽的堆载预压的效果。最初，标志和圆形的进步元素向上滑动，当加载完成其进度动画，也就是加载的页面的资产，整个“头”上移，而页面元素都透露了另一个动画。滑动的标志，其颜色变化，使蛋糕上的糖衣。

在本教程中，我们将重新创建看到Fontface忍者有一些调整，第二演示略有不同的影响效果。对于标志，我们将使用内联SVGs，这样我们就可以自己风格的路径在我们的CSS圆形进步的元素。我们将创建一个小脚本的行程动画加载SVG元素，然后我们会控制网页动画与我们添加到主容器类。

请注意，我们将使用CSS动画和CSS3D变换，所以这将是打算支持它们的浏览器才能正常工作。

立即下载浏览效果

相关热词：JavaScript效果 js预加载

上一篇：可拖动的360旋转预览jQuery插件

jQuery二维码生成插件：下一篇