0

我有一个页面，其中有几个链接打开不同的fancybox 画廊。

通过单击如下链接（在本例中为“galleryone”），每个画廊都被“激活”：

<a class="manualfancybox" data-gallery="galleryone" name="galleryone" id="galleryone" href="#galleryone">
    <img src="imageToClickToOpenGallery.png" />
</a>

每个画廊（在本例中为“galleryone”）由以下代码创建：

<div id="galleryone">
    <a href="001.jpg" rel="gal_one" class="fancybox" /></a>
    <a href="002.jpg" rel="gal_one" class="fancybox" /></a>
    […]
    <a href="020.jpg" rel="gal_one" class="fancybox" /></a>
</div>

当用户单击“imageToClickToOpenGalleryOne.png”时，它会全屏打开“galleryone”fancybox（再次感谢JFK。没关系，这正是它应该的样子。

“Manual Fancybox”使用以下 jquery：

/* MANUALFANCYBOX by JFK (https://stackoverflow.com/users/1055987/jfk) */
$(document).ready(function () {
    $(".manualfancybox").on("click", function () {
        var gallery = "#" + $(this).data("gallery");
        $(gallery).find(".fancybox").eq(0).click();
        return false;
    });
});

问题：如果用户访问了我的页面并单击了“imageToClickToOpenGalleryOne.png”，我如何创建链接，例如http://www.mysite.com/#galleryone以打开“galleryone”？

Javascript, jquery, php….htaccess?? 我自己也想不通，更别提解决方案了……</p>

由于安全原因，也许这甚至是不可能的，但是我需要一个解决方案来分享我的画廊的链接......

4

2 回答 2

1

对于这样的链接

http://www.mysite.com/#galleryone

您只需要将其添加到您当前的代码中：

if(window.location.hash) { 
    $(window.location.hash).trigger('click'); 
}

重要提示：只需确保将其放置在初始化之后fancybox()（或方法结束时ready()）。

编辑：OP说：

it's working but it's not showing the gallery background anymore, 
therefore I can't click anywhere outside the image 
to close the image window (it does work with "ESC" key though).

这似乎是提升问题，请尝试按以下顺序放置脚本调用：

<script src="../scripts/jquery.fancybox.min.js" type="text/javascript"></script> 
<script src="../scripts/scripts.js" type="text/javascript"></script>

Fancybox 应该在您放置 代码的scripts.js之前调用。现在首先调用scripts.js。$(window.location.hash).trigger('click');

于 2013-09-09T16:35:33.607 回答
1

您想在 url 中使用片段标识符。要做到这一点，请使用window.location.hash从井号上获取所有内容，例如：“ http://example.com#foobar ”有一个location.hash“#foobar”。您可以检查[window.onhashchange][1]事件以查看哈希是否已更改。然后，您可以解析哈希并加载您需要的任何内容。

于 2013-09-08T14:06:09.480 回答