无法使FancyBox内联显示

时间:2016-03-10 21:27:04

标签: jquery fancybox fancybox-2

我尝试使用演示中的确切代码。正是页面上的内容,我删除了它不需要工作的所有内容,并将该代码放在我的页面中。

但是当我点击时它只是作为一个锚标签处理并向上滚动。没有触发JS来创建FancyBox样式和显示。

我已经将文件移动到我已经设置的目录中,但我也尝试了它与演示一样。将源文件夹和lib文件夹放在上一层。

这是疯狂的事情。我有另一个fancybox实例只运行图像,它工作正常。

我搜索过,发现什么都没有帮助我。归结为某些东西并没有触发JS,我不知道为什么。

标题 -

<!DOCTYPE html>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<link rel="shortcut icon" href="img/favicon.png"> 
<link rel="stylesheet" type="text/css" href="css/reset.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link rel="stylesheet" type="text/css" href="css/style-responsive.css" />   

代码

              <li>
            <a class="fancybox" href="#test1" title="Lorem ipsum dolor sit amet">
              <img src="img/1.png" alt="" />
            </a>
          </li>

   <div style="display: none">
            <div id="test1">
          <h3>Etiam quis mi eu elit</h3>
          <p>
          adfLorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis mi eu elit tempor facilisis id et neque.
          </p>
        </div>
     </div>
   </section>

页脚

<script src="js/jquery-1.10.1.min.js"></script>    
<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.10.4.min.js" type="text/javascript"></script> 
<script src="js/jquery.nicescroll.js"></script> <!-- jQuery NiceScroll -->
<script src="js/jquery.sticky.js"></script> <!-- jQuery Stick Menu -->
<script src="js/masonry.pkgd.min.js"></script> <!-- All script -->
<script src="js/imagesloaded.pkgd.min.js"></script> <!-- All script --> 
<script>
    $(function(){

       var $container = $('.grid');

       $container.imagesLoaded( function(){
         $container.masonry({
           itemSelector : 'li'
         });
       });

     });
   </script>
  <script src="js/jquery.parallax.js"></script> <!-- jQuery Parallax -->  
  <script src="js/script.js"></script> <!-- All script -->  
  <!-- Add jQuery library -->

  <!-- Add mousewheel plugin (this is optional) -->
  <script type="text/javascript" src="js/jquery.mousewheel-3.0.6.pack.js"></script>

  <!-- Add fancyBox main JS and CSS files -->
  <script type="text/javascript" src="js/jquery.fancybox.js?v=2.1.5"></script>
  <link rel="stylesheet" type="text/css" href="css/jquery.fancybox.css?v=2.1.5" media="screen" />

  <!-- Add Button helper (this is optional) -->
  <link rel="stylesheet" type="text/css" href="js/helpers/jquery.fancybox-buttons.css?v=1.0.5" />
  <script type="text/javascript" src="js/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>

  <!-- Add Thumbnail helper (this is optional) -->
  <link rel="stylesheet" type="text/css" href="js/helpers/jquery.fancybox-thumbs.css?v=1.0.7" />
  <script type="text/javascript" src="js/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>

  <!-- Add Media helper (this is optional) -->
  <script type="text/javascript" src="js/helpers/jquery.fancybox-media.js?v=1.0.6"></script>

我在这里撕掉头发。我错过了什么?

1 个答案:

答案 0 :(得分:0)

这是我的script.js文件中阻止它的一行。一个破坏它的愚蠢的页面加载器命令。 DERP。