的fancybox链接不起作用（灯箱）

Question

我有一个灯箱（使用fancybox.net）位置：http://desertcinema.com/home-test/

而且我用一个画廊代码显示在画廊的形式图片：

这里是我的jQuery代码：

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

这是我的HTML：

<li class="portfolio-box photography"> 
      <a class="gallery" href="http://desertcinema.com/wp-content/uploads/bfi_thumb/SKRE-9-30sp4bav1hxsgwj54nvaww.jpg" title="Concealment"> 
       <img src="http://desertcinema.com/wp-content/uploads/bfi_thumb/SKRE-9-30sp4baun93pvbri4pf1ts.jpg" alt="" /> 
       <div class="mask"></div> 
       <div class="line-folio"></div> 
       <div class="line-folio1"></div> 
       <h4>Concealment</h4> 
      </a> 
     </li> 


    <li class="portfolio-box photography" style="width:335px;display:none;"> 
      <a class="gallery" rel=gallery1" href="http://desertcinema.com/wp-content/uploads/bfi_thumb/Mike-Full-Draw-30sp495yqivl82ubkxq5mo.jpg" title="Concealment"> 
       <img src="http://desertcinema.com/wp-content/uploads/bfi_thumb/SKRE-9-30sp4baun93pvbri4pf1ts.jpg" alt="" /> 
       <div class="mask"></div> 
       <div class="line-folio"></div> 
       <div class="line-folio1"></div> 
       <h4>Concealment</h4> 
      </a> 
     </li> 

使用我放在<a href="">上的类“图库”，但是当点击这个图像时没有下一个或上一个必须工作的按钮。

我只是跟着这个指令：http://fancyapps.com/fancybox/#examples

我会犯错误？如果需要，您可以使用Chrome检查元素。

Answer 1

尝试this.You在第一<一>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script> 
<script src="http://fancyapps.com/fancybox/source/helpers/jquery.fancybox-thumbs.js"></script> 
<link href="http://fancyapps.com/fancybox/source/helpers/jquery.fancybox-thumbs.css" rel="stylesheet"/> 
<link href="http://fancyapps.com/fancybox/source/jquery.fancybox.css" rel="stylesheet"/> 

<li class="portfolio-box photography"> 
      <a class="gallery" rel="gallery1" href="http://desertcinema.com/wp-content/uploads/bfi_thumb/SKRE-9-30sp4bav1hxsgwj54nvaww.jpg" title="Concealment"> 
       <img src="http://desertcinema.com/wp-content/uploads/bfi_thumb/SKRE-9-30sp4baun93pvbri4pf1ts.jpg" alt="" /> 
       <div class="mask"></div> 
       <div class="line-folio"></div> 
       <div class="line-folio1"></div> 
       <h4>Concealment</h4> 
      </a> 
     </li> 


    <li class="portfolio-box photography" style="width:335px;display:none;"> 
      <a class="gallery" rel="gallery1" href="http://desertcinema.com/wp-content/uploads/bfi_thumb/Mike-Full-Draw-30sp495yqivl82ubkxq5mo.jpg" title="Concealment"> 
       <img src="http://desertcinema.com/wp-content/uploads/bfi_thumb/SKRE-9-30sp4baun93pvbri4pf1ts.jpg" alt="" /> 
       <div class="mask"></div> 
       <div class="line-folio"></div> 
       <div class="line-folio1"></div> 
       <h4>Concealment</h4> 
      </a> 
     </li> 
<script> 
$(document).ready(function() { 
    $(".gallery").fancybox({ 
     openEffect : 'none', 
     closeEffect : 'none' 
    }); 
}); 
</script> 

失踪的rel = “gallery1”

Answer 2

尝试这种方式。没有DIV应该有李

$(document).ready(function() { 
 
\t $(".fancybox").fancybox({ 
 
\t \t openEffect \t : 'none', 
 
\t \t closeEffect \t : 'none' 
 
\t }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script> 
 

 
<script src="http://fancyapps.com/fancybox/source/helpers/jquery.fancybox-thumbs.js"></script> 
 
<link href="http://fancyapps.com/fancybox/source/helpers/jquery.fancybox-thumbs.css" rel="stylesheet"/> 
 
<link href="http://fancyapps.com/fancybox/source/jquery.fancybox.css" rel="stylesheet"/> 
 

 

 
      <a class="fancybox" rel="gallery1" href="http://farm2.staticflickr.com/1617/24108587812_6c9825d0da_b.jpg" title="Morning Godafoss (Brads5)"> 
 
\t <img src="http://farm2.staticflickr.com/1617/24108587812_6c9825d0da_m.jpg" alt="" /> 
 
</a> 
 
<a class="fancybox" rel="gallery1" href="http://farm4.staticflickr.com/3691/10185053775_701272da37_b.jpg" title="Vertical - Special Edition! (cedarsphoto)"> 
 
\t <img src="http://farm4.staticflickr.com/3691/10185053775_701272da37_m.jpg" alt="" /> 
 
</a> 
 
<a class="fancybox" rel="gallery1" href="http://farm1.staticflickr.com/574/22407305427_69cc6e845f_b.jpg" title="Racing against the Protons (tom.leuzi)"> 
 
\t <img src="http://farm1.staticflickr.com/574/22407305427_69cc6e845f_m.jpg" alt="" /> 
 
</a> 
 
<a class="fancybox" rel="gallery1" href="http://farm1.staticflickr.com/291/18653638823_a86b58523c_b.jpg" title="Lupines (Kiddi Einars)"> 
 
\t <img src="http://farm1.staticflickr.com/291/18653638823_a86b58523c_m.jpg" alt="" /> 
 
</a>