Fancybox添加弹出图像的链接

Question

我在页面加载时弹出一个显示图像的弹出窗口,当它点击它关闭的某个地方时.我希望弹出窗口成为另一个页面的链接.有任何想法吗？

我目前的代码:

HTML:

<a id="hidden_link" href="image.jpg" style="visibility:hidden;"><img src="image.jpg")</a>

jQuery的:

<script type="text/javascript">
$(document).ready(function() {                        
$("#hidden_link").fancybox().trigger('click');
});
</script>    

此Jquery触发隐藏链接,以便fancybox显示.有没有办法添加到image.jpg的链接？

使用fancybox 1.3.4

Answer 1

首先,如果你隐藏了元素(visibility:hidden),你不需要<img>在你的html代码中使用缩略图(),否则你只是在你的页面加载中增加额外的开销,所以这应该足够了:

<a id="hidden_link" href="image.jpg" style="visibility:hidden;"></a>

其次,要添加一个链接到已经在fancybox中打开的图像,你可以.wrap()在fancybox的onComplete回调中使用这个方法,如下所示:

jQuery(document).ready(function ($) {
    $("#hidden_link").fancybox({
        onComplete: function () {
            $("#fancybox-img").wrap($("<a />", {
                // set anchor attributes
                href: this.href, //or your target link
                target: "_blank" // optional
            }));
        }
    }).trigger("click");
});

看到 JSFIDDLE

注意:这适用于fancybox v1.3.4