Fancybox 图像消失答案

【问题标题】：Fancybox image disappearFancybox 图像消失
【发布时间】：2013-05-05 14:00:37
【问题描述】：

点击图片后图片一直消失。

HTML

<div class="container">
    <section id="picture-container">
        <div class="picture-box">
            <a href="gallery/img1.JPG" class="fancybox" rel="group"><img src="gallery/small-images/img1.JPG"></a>
        </div>
        <div class="picture-box">
            <a href="gallery/img2.JPG" class="fancybox" rel="group"><img src="gallery/small-images/img2.JPG"></a>
         </div>
     </section>
</div> <!-- /container -->

JavaScript

<script src="scripts/jquery.fancybox.js"></script>
<script type="text/javascript" src="/scripts/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<script type="text/javascript" src="/scripts/helpers/jquery.fancybox-media.js?v=1.0.5"></script>
<link rel="stylesheet" href="/scripts/helpers/jquery.fancybox-thumbs.css?v=1.0.7" type="text/css" media="screen" />
<script type="text/javascript" src="/scripts/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>

<script>
    $(document).ready(function() {
        context = $('#picture-container');
        $("a.fancybox", context).fancybox();
    });
</script>

【问题讨论】：

自己解决了：'#picture-container img { display: block !important; }' 每次单击后，图像将显示：无。这就是解决方案。
如果没有像$("a.fancybox").fancybox(); 这样的任何上下文绑定fancybox 会更容易...查看您的代码工作jsfiddle.net/rUBrt .... 为什么过度复杂的事情？
使用上下文会更容易找到类吗？

标签： jquery image fancybox fancybox-2

【解决方案1】：

如何回答（2014 年），在 Stack 中的此链接中：

Thumbnails disappears after click on them, FancyBox

将href 设置为src 中的img：

<a class="fancybox" href="image_source" data-fancybox-group="gallery" title=""><img src="image_source" alt="" /></a>

【讨论】：