插件描述：这是一款以Glitch闪烁为过渡动画效果的js轮播图特效。 Glitch效果是一种类似电视或电脑屏幕故障时的闪烁效果，在网页中可以通过CSS来模拟这种效果。
该插件不支持IE
首先插入样式表，可根据自己需求调整样式
1 2 | <link rel="stylesheet" type="text/css" href="css/base.css"/> <link rel="stylesheet" type="text/css" href="css/glitch-slideshow.css"/> |
在页面代码底部插入所需JS
1 2 3 | <script src="js/imagesloaded.pkgd.min.js"></script> <script src="js/demo.js"></script> <script src="js/demo2.js"></script> |
在这里放置需要过渡的图片
1 2 3 4 5 6 7 8 9 10 11 12 | <div class="slide slide--current"> <div class="slide__img glitch" style="background-image: url(img/f2.jpg);"></div></div><div class="slide"> <div class="slide__img glitch" style="background-image: url(img/f3.jpg);"></div></div><div class="slide"> <div class="slide__img glitch" style="background-image: url(img/f1.jpg);"></div></div><div class="slide"> <div class="slide__img glitch" style="background-image: url(img/f4.jpg);"></div></div> |
而demo2中放置图片的位置是
1 | <div class="slide__img glitch" style="background-image: url(img/2.jpg);"></div> |
特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com
- 上一个特效： 自适应创意展示jQuery和CSS3的网站模板
- 下一个特效： 基于jQuery图层上模态框进出方向