FancyBox链接没有显示在灯光盒中-我遗漏了什么？

Question

FancyBox链接没有显示在灯光盒中-我遗漏了什么？好吧，我以为我正确地实现了这一点，但我想我一定是在某个地方搞错了。这是我的密码：jQuery在这里：jQuery(document).ready(function( $ ){$(function() {     $( ".cta-nav-hover" ).tooltip({         show: null,         position: {             my: "right+40 bottom",             at: "left bottom"         },         open: function( event, ui ) {             ui.tooltip.animate({ top: ui.tooltip.position().top - 10 }, 75 );         }     });});$(function() {     $(".fancybox").fancybox();});});然后是HTML：<div id="cta-nav-wrapper">     <ul id="cta-nav">         <li class="bio">             <a href="http://placehold.it/350x125" title="Bio" class="cta-nav-hover fancybox"><span></span></a>         </li>     </ul></div>我认为这是可行的，但当我单击该链接时，它只会让我看到占位符图像，而不是弹出。我做错什么了？看起来我的文件排列得很好，或者至少当我通过Firebug检查它们时，就会找到正确的js。我也尝试过另一个叫做MagniicPopup的插件，但是它也没有响应。我想这和我的WordPress主题的设置有关。

Answer 1

这，这个href="http://placehold.it/350x125"不要对FancyBox说您正在打开image所以你任一 :

1)。添加fancybox.image特制班级，等级你的链接就像

<a class="cta-nav-hover fancybox fancybox.image" href="http://placehold.it/350x125" title="Bio"><span></span></a>

2)。添加(HTML 5)data-fancybox-type属性添加到您的链接中，如下所示

<a data-fancybox-type="image" href="http://placehold.it/350x125" title="Bio" class="cta-nav-hover fancybox"><span></span></a>

3)。添加type选择FancyBox脚本，如

$(".fancybox").fancybox({
   type: "image"});

你认为对你的案子更有用的东西。

注：数字1)。和2)。以上工作仅适用于FancyBox v2.x。(第三条)。为V1.3.4和V2.x工作

编辑*包括JSFIDDLE使用您的代码和jQueryv1.8.3。

有两个环节：

• 一个使用“fancybox.Image”类：

  工作

• 其他没有：

  不工作