图片闪烁过渡特效

所属分类:其他,媒体-动画效果,幻灯片和轮播图

 40067  462  查看评论 (4)
分享到微信朋友圈
X
图片闪烁过渡特效 ie兼容12

该插件不支持IE
首先插入样式表,可根据自己需求调整样式

<link rel="stylesheet" type="text/css" href="css/base.css"/> 
<link rel="stylesheet" type="text/css" href="css/glitch-slideshow.css"/>

在页面代码底部插入所需JS

<script src="js/imagesloaded.pkgd.min.js"></script> 
<script src="js/demo.js"></script> 
<script src="js/demo2.js"></script>

在这里放置需要过渡的图片

<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中放置图片的位置是

<div class="slide__img glitch" style="background-image: url(img/2.jpg);"></div>
相关插件-动画效果,幻灯片和轮播图

文字插件特效_文字动画特效js插件

此插件是针对文字写的一个动画插件,主要可运用在开场和出场的时候,插件方便小巧,只需要配置参数即可达到数十种动画效果
  动画效果
 59876  856

简单实用的jQuery和CSS3卡片自动翻牌特效

这是一款简单实用的jQuery和CSS3卡片自动翻牌特效。该卡片翻转效果使用CSS3透视和backfacevisibility属性来制作卡片正反面效果,并使用jQuery使其自动旋转起来。
  动画效果
 49790  357

js火焰特效

来自Doom PSX / Nintendo64的火焰效果
  动画效果
 25657  264

新年快乐粒子烟花

根据其他插件改编拜年烟花效果
  动画效果
 47008  449

讨论这个项目(4)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    木寸 0
    2020/1/31 17:10:56
    oops ;) 0
    2019/1/3 10:05:49
    涛声依旧 0
    2018/9/1 17:22:58
    666 666 6666 66
        扣扣啊0
        2018/11/13 21:21:03
        66666666666666666666666666
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复