网站添加图片点击放大效果 强大的图片查看器插件Viewer.js

WEB端方向


1、引入文件


JS 版本:


<link rel="stylesheet" href="css/viewer.min.css">

<script src="js/viewer.min.js"></script>


jQuery 版本:


<link rel="stylesheet" href="css/viewer.min.css">

<script src="js/jquery.min.js"></script>

<script src="js/viewer.min.js"></script>

注意:JS 版本和 jQuery 版本名字虽然一样,但代码不一样,不能通用。


2、HTML


<ul id="jq22">

    <li><img src="img/tibet-1.jpg" alt="图片1"></li>

    <li><img src="img/tibet-2.jpg" alt="图片2"></li>

    <li><img src="img/tibet-3.jpg" alt="图片3"></li>

    <li><img src="img/tibet-4.jpg" alt="图片4"></li>

    <li><img src="img/tibet-5.jpg" alt="图片5"></li>

    <li><img src="img/tibet-6.jpg" alt="图片6"></li>

</ul>


3、JavaScript


JS 版本:


var viewer = new Viewer(document.getElementById('jq22'));


jQuery 版本:


$('#jq22').viewer();



下载地址:点此下载


« 上一篇下一篇 »