问通过简单链接启动Photoswipe图库
EN

Stack Overflow用户

提问于 2013-08-17 22:31:33

回答 1查看 1.6K关注 0票数 1

我使用photoswipe插件：

(function(window, PhotoSwipe){
    document.addEventListener('DOMContentLoaded', function() {
        var options = {
            preventHide: true,
            getImageSource: function(obj) {
                return obj.url;
            },
            getImageCaption: function(obj) {
                return obj.caption;
            }
        },
        instance = PhotoSwipe.attach([
            { url: 'http://www.site.com/img/8896/ico5.jpg', caption: 'Image 001' },
            { url: 'http://www.site.com/img/8897/ico5.jpg', caption: 'Image 002' },
            { url: 'http://www.site.com/img/8898/ico5.jpg', caption: 'Image 003' },
            { url: 'http://www.site.com/img/8899/ico5.jpg', caption: 'Image 004' },
            { url: 'http://www.site.com/img/9000/ico5.jpg', caption: 'Image 005' },
            { url: 'http://www.site.com/img/9001/ico5.jpg', caption: 'Image 006' }
        ], options);

        instance.show(0);
    }, false);
}(window, window.Code.PhotoSwipe));

我想从我的页面中的一个简单的url启动画廊，如下所示：

<a href="#" id="photo">
    <img src="/img/ico_photo1.png" border="0" /><br>
    Gallery
</a>

但是我不知道怎么做，你能帮我吗？

jquery

photoswipe

回答 1

Stack Overflow用户

发布于 2013-08-18 01:11:51

好的，这段代码对我来说是有效的：

function startSwipe()
{

(function(window, PhotoSwipe){

var
options = {
preventHide: false,
loop: false,
allowUserZoom = false,
getImageSource: function(obj){
return obj.url;
},
getImageCaption: function(obj){
return obj.caption;
}
},
instance = PhotoSwipe.attach( 
[
{ url: 'http://www.site.com/img/nameimg1.jpg', caption: 'description'},
{ url: 'http://www.site.com/img/nameimg2.jpg', caption: 'description'},                     
{ url: 'http://www.site.com/img/nameimg3.jpg', caption: 'description'},                     

], 
options 
);
instance.show(0);

}(window, window.Code.PhotoSwipe));

}

html：

<a href="#" onClick="startSwipe();"><img src="/img/ico1.png" border="0" /><br>Gallery</a>

我希望将来会有人来服务于。

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/18289888

复制

相似问题

问通过简单链接启动Photoswipe图库
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问通过简单链接启动Photoswipe图库EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问通过简单链接启动Photoswipe图库
EN