6

我是 jquery mobile 和 jquery 的新手。我正在使用 phonegap 和 jquery mobile 进行项目。我正在将 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);

查看全部按钮根本不起作用。我已经尝试过他们给定的代码，但没有运气。我什至尝试了我现在所做的，但它仍然不起作用。对不起我糟糕的英语。请帮助我...在此先感谢。

4

1 回答 1

7

解释

这是一个 PhotoSwipe 错误，可能不是错误但仍然是一个问题。

首先让我问你为什么要拥有两个具有相同属性的按钮？按钮返回和您的按钮查看全部会做同样的事情。

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();
    });
});
于 2013-05-12T12:37:50.643 回答