jquery.picEyes.js 一款jquery图片播放全屏插件,支持手机效果
  • 分享到微信朋友圈
    X

picEyes 是一个简单、轻量级的 jQuery 画廊/图像查看器插件,用于以全屏模式呈现图像。该插件在模态样式的完整浏览器窗口弹出窗口中显示放大的图像, 用户可以通过单击导航箭头和底部缩略图在它们之间导航。还支持无限循环。

使用方法

1. 将 jQuery 库和 jQuery picEyes 插件放在 html 页面的底部。

<script src="js/jquery-3.3.1.min.js" type="text/javascript"></script> 
<script src="js/jquery.picEyes.js"></script>

2. 将要呈现的图像添加到 html 无序列表中,如下所示。

<ul class="clearfix demo">
    <li>
        <img src="images/1.jpg" /></li>
    <li>
        <img src="images/2.jpg" /></li>
    <li>
        <img src="images/3.jpg" /></li>
    <li>
        <img src="images/4.jpg" /></li>
    <li>
        <img src="images/5.jpg" /></li>
    <li>
        <img src="images/6.jpg" /></li>
</ul>

3. picEyes初始化

<script>
    $(function () {
        //picturesEyes($('.demo li'));
        $('.demo li').picEyes();
    });
</script>