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

拉丁傳說 2018-4-13 1252

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 放到頁面底部即可。

演 示 下 載

最新回復 (0)
返回
發新帖
下载麻将游戏四人麻将