首页

关于

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

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

在线演示  本地下载

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

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

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

浏览器支持:

iefirefoxchromeoperasafari

主要代码

HTML代码:

<div class="container">

<!-- Codrops top bar -->
<div class="codrops-top">
<a…

标签: jQuery, CSS3, jQuery全屏幕幻灯

阅读更多

标签

© Copywrite by gbin1.com, all rights reserved.