hotopile JS – jQuery照片堆叠效果插件

分类:代码 日期:

hotopile JS - jQuery照片堆叠效果插件

演 示 下 载

简介

hotopile JS 是模拟照片散布堆叠在一起的 jQuery 图片插件,它能够很的制作照片墙效果。点击缩略图,照片会弹出放大,左右的箭头可以查看“上一张”、“下一张”,再次点击会返回。缩略图可以拖动,所以即使被叠在非常后面的照片也能够轻松的找到。

兼容

浏览器兼容:兼容 IE9 及以上版本和其他主流浏览器。

jQuery 兼容:兼容 1.8 及以上版本。

使用方法

1、引入文件

<link rel="stylesheet" href="css/photopile.css">
<script src="js/jquery.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/photopile.js"></script>

建议将 js 放到页面底部,至少需要将 photopile.js 放入底部,因为 photopile.js 会自动执行,在执行之前需要先加载 HTML。

2、HTML

<div class="photopile-wrapper">
    <ul class="photopile">
        <li>
            <a href="images/fullsize/01.jpg">
                <img src="images/thumbs/01.jpg" alt="" width="133" height="100">
            </a>
        </li>
        ……
    </ul>
</div>

参数

hotopile JS 没有或者说没有提供参数,只需将 hotopile JS 放到页面底部即可。

标签:
查看演示

下载本素材需消耗 50 积分

无法下载?立即反馈