3

使用 Lightbox 2 我有一组链接，它们创建了一个名为“roadtrip”（非常标准）的画廊，但是我在页面上的画廊中也有一个更大版本的图像，并希望打开“roadtrip”画廊没有它向现有图像添加另一个实例。

我还有一个名为“查看大图像”的按钮，我还想打开“roadtrip”画廊，而不需要创建额外的实例。

在我添加这些内容的那一刻，即使完全删除了 href="" 它仍然会触发图库中的空白实例，我只需要另外两个链接即可打开图库，而无需尝试向其中添加任何内容。

例如：

<a href="image1.jpg" rel="lightbox[roadtrip]">Image One</a>
<a href="image2.jpg" rel="lightbox[roadtrip]">Image Two</a>
<a href="image3.jpg" rel="lightbox[roadtrip]">Image Three</a>
<a href="image4.jpg" rel="lightbox[roadtrip]">Image Four</a>

<a rel="lightbox[roadtrip]">View Large Images</a>

问题是，虽然“查看大图像”会打开灯箱库，但我不希望灯箱实际尝试从该链接渲染任何内容（它会自动执行），当单击“查看大图像”时，它会打开灯箱和挂在画廊的第 5 个实例上，然后您可以单击左或右查看实际图像，但我更喜欢单击“查看大图像”时在“图像一”打开灯箱 [roadtrip] 的东西。

希望我已经正确解释了事情，必须有办法做到这一点。

有人知道如何实现这一目标吗？非常感谢您的帮助。

4

1 回答 1

5

自己使用一点 jQuery 研究解决了这个问题，下面是我使用的解决方案。

你需要 jQuery 启动，它带有 lightbox 2。

HEAD部分数据：

<script type="text/javascript">

    $(document).ready(function() {

        $('#click-to-enlarge').click(function() {

            $('#gallery-image-1').trigger('click');

        });

    });

</script>

BODY部分数据：

<a href="image1.jpg" id="gallery-image-1" rel="lightbox[roadtrip]">Image One</a>
<a href="image2.jpg" rel="lightbox[roadtrip]">Image Two</a>
<a href="image3.jpg" rel="lightbox[roadtrip]">Image Three</a>
<a href="image4.jpg" rel="lightbox[roadtrip]">Image Four</a>

<a href="#" id="click-to-enlarge">View Large Images</a>

这是我第一次在这里回答问题，所以有人可能想让代码示例更“漂亮”一些，以便人们理解。

希望这可以帮助其他人在我的情况:)

于 2013-08-09T04:24:28.327 回答