Question

我一直在搜索，我找不到任何与我的问题相关的帖子，所以我决定在Stackoverflow上询问。我有这个简单的prettyPhoto画廊，我需要通过灯箱中的FontAwesome图标打开。有人可以帮帮我吗？

代码：

照片：

我在PHP中有一个foreach循环，它在各自的图库中呈现每个图库的图像，在本例中为pp_gal

foreach ($talent_photos as $image) {
    echo "<a href='{$image['url']}' rel='prettyPhoto[pp_gal]'><img src='{$image['url']}' width='{$image['width']}' height='{$image['height']}' alt='{$image['alt']}' /><br></a><br>";
}

图标：

这是Icon的标记，应该在灯箱中打开它们的图库。

<a class="icon-btn lens-icon"><br>
    <img src="http://192.55a.myftpupload.com/wp-content/uploads/2015/10/lens.png" alt=""><br>
</a>

我希望我能正确解释，如果我没有让我知道......

谢谢..

Answer 1

在prettyPhoto插件页面上，没有插件方法的文档，因此最好的方法是在图库的第一个元素上触发click事件。

所以在fontAwesome按钮上添加prettyPhoto图库ID，例如：

<a class="icon-btn lens-icon" data-gallery="prettyPhotto[pp_gal]"><br>
    <img src="http://192.55a.myftpupload.com/wp-content/uploads/2015/10/lens.png" alt=""><br>
</a>

您可以通过JavaScript触发此操作：

$("[data-gallery]").click(function(){
    var galleryID = $(this).data("gallery");
    $("a[rel='"+galleryID+"']").eq(0).trigger("click");
});

使用FontAwesome Icon

1 个答案: