日期:2014-05-17  浏览次数:20654 次

使用jQuery和CSS3创建一个全屏幕幻灯效果

日期:2012-6-17??来源:GBin1.com

使用jQuery和CSS3创建一个全屏幕幻灯效果

在线演示 ? 本地下载

在今天这篇文章中,我们将介绍来自于tympanus 的 一个全屏幻灯特效教程,在这个教程中将介绍如何使用jQuery和CSS3来实现一个全屏的幻灯特效,你将看到每一个幻灯都从水平或者垂直中间断开然后消 失,使用不同的data-attributes属性来定义类型,旋转和角度等幻灯属性,这样我们可以创建非常独特的幻灯效果。

我们将使用到如下的插件:

  • jQuery cond by Ben Alman:帮助你使用链式来书写if-then-else语句
  • jQuery Transit by Rico Sta. Cruz:帮助你更见简单快捷的使用CSS3动画

浏览器支持:

iefirefoxchromeoperasafari

主要代码

.......

来源:使用jQuery和CSS3创建一个全屏幕幻灯效果