不一样的层叠照片动画-ANIMATED CSS3 PHOTO STACK

查看演示立即下载

插件描述：今天我要给大家介绍一款动画的照片堆叠插件，两张照片之间有多种切换效果可供我们选择，而这些效果仅仅使用到了css3，所以要想使用该插件，就必需是支持css3的浏览器和设备。该插件也会更新到可以像幻灯片一样去使用。

今天我要给大家介绍一款动画的照片堆叠插件，两张照片之间有多种切换效果可供我们选择，而这些效果仅仅使用到了css3，所以要想使用该插件，就必需是支持css3的浏览器和设备。该插件也会更新到可以像幻灯片一样去使用。

使用步骤

1、引入以下的js和css文件

<link href="assets/css/style.css" rel="stylesheet">
<link href="assets/css/animate.css" rel="stylesheet">
<scriptsrc="/"></script>
<script src="assets/js/script.js"></script>

2、在body标签中加入以下格式的html代码，整个外部容器就是一个ID为 photos 的ul标签元素，里面包含的每张图片则是一个 li 标签，而图片是以背景图片的形式显示的。

<ul id="photos">
    <li>
        <a href="/"style="background-image:url(/);">Landscape 5</a>
    </li>
    <li>
        <a href="/"style="background-image:url(/);">Landscape 4</a>
    </li>
    <li>
        <a href="/" style="background-image:url(/);">Landscape 3</a>
    </li>
    <li>
        <a href="/"style="background-image:url(/);">Landscape 2</a>
    </li>
    <li>
        <a href="/" style="background-image:url(/);">Landscape 1</a>
    </li>
[/code]
</ul>

3、插入导航按钮的 html 代码，实际上就是两个 a 标签

<a href="#" class="arrow previous"></a> <a href="#" class="arrow next"></a>

该插件没有提供参数配置，不过大家可以查看js源码去修改相关的参数。

特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com

上一个特效：有趣的圆形幻灯片-FLIPPING CIRCLE SLIDESHOW
下一个特效：五彩的带图标的动画菜单