fancybox 在新标签页中打开

Question

我关注html：

<a href="createCompany/getOriginalImage/1" class="fancy_image"><img id="right_tab_image" src="createCompany/getSmallThumbnail/1" alt=""></a>

并在页面加载时执行以下代码（在调试中测试）：

 $(document).ready(function(){
        $(".fancy_image").fancybox({
            type        : 'image',
            openEffect  : 'none',
            closeEffect : 'none'
        });
    });

页面包括以下来源：

但是当我点击 href 图像打开时，却在另一个选项卡中。

我忘记了什么？

Answer 1

所提供代码的模仿似乎有效：

HTML

<a class="fancybox" href="http://picsofcanada.com/wp-content/uploads/2014/03/11wwartsuewilkinslooktothecoast.jpg"
style='width:50px;'> 
<!-- Note that FancyBox ignores this width styling -->
<img src="http://picsofcanada.com/wp-content/uploads/2014/03/11wwartsuewilkinslooktothecoast-150x150.jpg" alt="" /><br>
<b>Click to trigger Fancybox</b></div>

jQuery

$(document).ready(function () {
    $('.fancybox').fancybox({
       padding: 0,
       type        : 'image',
       openEffect  : 'none',
       closeEffect : 'none'
    });
});

参见 this demo。

所以你应该尝试让它工作：

使用最新版本的jQuery和最新版本的fancybox。 Sometimes there are problems with the versions.
确保 fancybox.js 已实际加载
以完整 http://.. 格式指定图片链接

我认为如果您遵循所有这些要点，它就会奏效。否则，检查是否有任何其他插件导致 fancybox 出现问题。

Answer 2

是的，有效。我力图将类型设置为 fancybox 中的图像。我最终用 fancybox 放置了一个空的占位符 div 标签来代替活动的 flex 幻灯片。这导致白色 space 出现在花式框的背景中。它已通过以下设置修复。

window.setTimeout(function () {
    jQuery('.slides a.fancybox')
        .attr('rel', 'gallery')
        .fancybox({
            arrows: true,
            type:'image'
        })
});

fancybox 在新标签页中打开

fancybox opens in new tab

javascript

jquery

fancybox

HTML

jQuery