jQuery移动端图片查看插件photoswipe.js

所属分类:媒体-图片展示

 61536  394  查看评论 (27)
分享到微信朋友圈
X
jQuery移动端图片查看插件photoswipe.js ie兼容8

使用方法

1.class='pswp'的div需要直接放在页面中。

2.根据自己最外层div的类名来定义属性(如id='imgshow')

initPhotoSwipeFromDOM('#imgshow');
    $("#imgshow>figure>div").each(function(){
        $(this).height($(this).width());
});

3.根据自己从后台获取图片的大小,来计算出a标签里data-size的值,再赋值进去

相关插件-图片展示

jQuery图片预览插件

jQuery图片预览插件,支持图片放大,缩小,旋转。
  图片展示
 75491  450

jquery3D旋转相册

jquery3D旋转相册
  图片展示
 50816  464

jQuery背景墙聚光灯效果代码

jQuery背景墙聚光灯效果代码
  图片展示
 27202  298

jQuery移动端图片查看插件photoswipe.js

实现了移动端图片查看缩放,左右切换效果
  图片展示
 61537  394

讨论这个项目(27)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    Jenny 0
    2020/4/2 11:52:04
    请问,可以不定义弹层里图片的尺寸吗,定宽或定高,另一边自适应
        3倍的根号21
        2021/1/28 15:24:10

        里面的JS不完整,要加上这段代码:

        var img = new Image();
        img.src = linkEl.getAttribute('href');
        
        linkEl.setAttribute('data-size', img.naturalWidth + 'x' + img.naturalHeight);
        size = linkEl.getAttribute('data-size').split('x');

        这样就可以做到 获取图片的宽高,自适应

    回复
    南北. 0
    2020/2/22 17:25:09
    Peter@小飞侠 0
    2020/2/18 14:30:53
    好像点击后不能放大 回复
    2239329788 0
    2019/11/5 19:24:55
    我怎么点击一下图片 ,就可以缩小啊?像微信那种 回复
    Storm丶T1King 0
    2019/10/11 17:50:07
    不错,挺好用的 回复
    王志勇 0
    2019/8/29 15:38:23
    为什么没有看到关闭按钮分享按钮呢,然后按ESC退出查看模式,页面自动刷新? 回复
    文苑 0
    2019/6/27 11:48:48
    是否可以去掉shareButtons参数或者将其设置为false?? 回复
    苦瓜君. 0
    2019/6/11 17:54:48
    移动端不能左右手势滑动,只能点击箭头切换。没多大参考意义,有需要的可以去找下smartphoto插件
        ??0
        2019/6/14 13:05:19
        谢谢
    回复
    King 0
    2019/5/23 14:37:17
    效果很好,就是我想找的 回复
              0
    2019/4/28 10:03:00
    没金币,下不了啊 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复