使用jquery mobile的photoswipe自定义工具栏
使用jquery mobile的photoswipe自定义工具栏
提问于 2013-05-03 21:00:07
我对jquery手机和jquery也是新手。我正在与phonegap和jquery移动的一个项目。我正在使用PhotoSwipe的图片库。它工作得很好，可以显示图像。但我想为我的图库制作一个自定义的photoswipe工具栏。我看到了他们给出的自定义工具栏示例，差一点就成功了。但是，尽管我在这个领域是个新手，所以我没能把它与jquery mobile集成起来。我的自定义按钮根本不起作用。以下是我的代码示例。
for (var i = 0; i < photo_len; i++) {
$('.GalleryAccessories').append('<li><a href="' + image_item[i].original + '" rel="external"><img src="' + image_item[i].original + '" alt=""/></a></li>');
}
$('.GalleryAccessories').trigger("create");
var myPhotoSwipe = $(".GalleryAccessories a").photoSwipe({
getToolbar: function(){
return '<div class="ps-toolbar-close" style="padding-top: 12px;">Back</div><div class="ps-toolbar-play" style="padding-top: 12px;">Play</div><div class="ps-toolbar-previous" style="padding-top: 12px;">Previous</div><div class="ps-toolbar-next" style="padding-top: 12px;">Next</div><div class="ps-toolbar-close" style="padding-top: 12px;">View All</div>';
},
jQueryMobile: true,
loop: false,
enableMouseWheel: false,
enableKeyboard: false
});
myPhotoSwipe.show(0);“全部查看”按钮根本不起作用。我试过他们给出的代码，但没有成功。我甚至尝试了我现在所做的，但仍然不起作用。对不起，我的英语很差。请帮帮我。提前谢谢。
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-05-12 20:37:51
解释
这是一个PhotoSwipe错误，也许不是一个错误，但仍然是一个问题。
首先，让我问您为什么要有两个具有相同属性的按钮？Button Back和您的button View All会做同样的事情。
Photoswipe只会增强第一次出现的类ps-toolbar-close，所有其他的都会被忽略。老实说，我不明白这个解决方案的意义。如果用户想要更多的按钮，就让他们拥有吧。
这个问题可以通过编程来解决。
解决方案
工作示例：http://jsfiddle.net/Gajotres/nBZfT/
HTML :
<div class="ps-toolbar-close second-close" style="padding-top: 12px;">View All</div>Javascript :
myPhotoSwipe.addEventHandler(window.Code.PhotoSwipe.EventTypes.onShow, function(e) {
$(document).off('click', '.second-close').on('click', '.second-close', function(){
e.target.hide();
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/16359518
复制相关文章
相似问题
腾讯云开发者
