评论：仿微信朋友圈图片展示效果  [查看原文]

小白0
2016/7/22 10:07:21
就是要这个图片滑动的效果，这个东西真是太棒了啊,

Angularjs0
2016/12/10 14:12:14
我也是，我用angularjs循环出来，点击图片就跳转链接了

runningding0
2016/12/21 18:12:19

同问，咋解决的

runningding0
2016/12/22 13:12:08
其实是因为写错地方了，写对了就不会跳转图片链接了。

?_╉ ??╃0
2017/1/5 15:01:10

请问下是哪里写错了呢

用户56825881430
2017/4/21 14:58:12

同问如何解决的

前端――于小月0
2017/6/29 18:06:38

同问如何解决的

size = linkEl.getAttribute('data-size').split('x'); 
// create slide object
item = {
    src: linkEl.getAttribute('href'),    
    w: parseInt(size[0], 10),   
    h: parseInt(size[1], 10)
};

这个怎么改才能让图片自适应，而不是被强行拉伸？

码趣0
2017/2/15 17:16:28
加载图片之后 写个方法 重新根据图片设置图片的原始 宽 高给data-size

金刚狼~/:;0
2016/7/11 14:07:43
同问

旋转3650
2016/7/21 11:07:09
找到button关闭标签加上style即可实现点击图片隐藏效果<button class="pswp__button pswp__button--close" style="position: fixed;left: 0;top:0;height: 100%;width: 100%;" title="Close (Esc)"></button>

iepngs1
2016/4/30 0:04:05

每个img标签的父元素a标签上有个data-size属性，就是放大后的尺寸，如果要设置自动适合需要更改js代码中以下部分：

size = linkEl.getAttribute('data-size').split('x'); 
//create slide object
item = {  
    src: linkEl.getAttribute('href'),   
    w: parseInt(size[0], 10),   
    h: parseInt(size[1], 10)
};

oy1
2016/5/20 9:05:49

源码看不进去。。。用了别的方法做好了。。在

// execute above function
initPhotoSwipeFromDOM('.my-gallery');

的前面加上下面的代码。

var linkArr = $('.my-gallery figure a[data-size="800x1142"]');
var num = 0;
$.each(linkArr,function(index, value) {
    var src = $(value).attr('href');
    var imageEle = new Image();
    imageEle.tag = value;
    $(imageEle).load(function() {
        console.log(this.src + this.width + '===' + this.height + '===');
        $(this.tag).attr('data-size', this.width + 'x' + this.height);
        num++;
    });
    imageEle.src = src;
});

拿到每张图片的尺寸，再赋给data-size。

小马0
2016/6/13 15:06:06
这个自适应的写法不管用啊，为什么

oy0
2016/11/11 15:11:30
你看看你linkArr的路径对不，我这个方法现在也还在用。。没有什么问题呢

Faith、?0
2016/11/19 16:11:46
你是用jq来写的 它这个demo没有引入jq 所以不管用 应该是这问题咯！！！

Faith、?0
2016/11/19 17:11:04
顺便问下大神，我不想它图片拉上拉下 有什么办法解决没

T,an0
2016/12/4 12:12:59
很不错

Angularjs0
2016/12/10 16:12:14
请问大神，为什么用js循环div之后，不起作用了呢

??梦，??哭0
2016/5/19 17:05:38
查看JS里面那个button的代码，修改下链接