码迷,mamicode.com
首页 > 其他好文 > 详细

PhotoSwipe用法

时间:2017-08-09 10:15:18      阅读:336      评论:0      收藏:0      [点我收藏+]

标签:upd   自动   style   .com   div   tps   attribute   ima   显示   

1、自动识别data-size问题,添加以下代码

gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options);
                    gallery.listen(‘imageLoadComplete‘,
                    function (index, item) {
                        var linkEl = item.el.children[0];

                        if (!linkEl.getAttribute(‘data-size‘) || linkEl.getAttribute(‘data-size‘) == ‘auto‘) {
                            var img = new Image();
                            img.src = linkEl.getAttribute(‘href‘);

                            linkEl.setAttribute(‘data-size‘, img.naturalWidth + ‘x‘ + img.naturalHeight);
                            item.w = img.naturalWidth;
                            item.h = img.naturalHeight;
                            gallery.invalidateCurrItems();
                            gallery.updateSize(true);
                        }
                    });
                    gallery.init();

2、buttons不显示问题,没找到原因

  通过排除法,可能是css的问题,解决办法是,使用cdn的css,但是我把css相关的文件从cdn中下载下来还是不行。不知道是怎么回事。

<link rel="stylesheet" href=‘https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.1/photoswipe.css‘>
<link rel="stylesheet" href=‘https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.1/default-skin/default-skin.css‘>

 

PhotoSwipe用法

标签:upd   自动   style   .com   div   tps   attribute   ima   显示   

原文地址:http://www.cnblogs.com/zhaoyihao/p/7323318.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!