我尝试使用演示中的确切代码。正是页面上的内容,我删除了它不需要工作的所有内容,并将该代码放在我的页面中。
但是当我点击时它只是作为一个锚标签处理并向上滚动。没有触发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>
我在这里撕掉头发。我错过了什么?
答案 0 :(得分:0)
这是我的script.js文件中阻止它的一行。一个破坏它的愚蠢的页面加载器命令。 DERP。