2012-10-18 98 views
1

我一直在试用Fancybox作为灯箱的替代品。但是,我似乎无法使其发挥作用。我的图像总是在新的选项卡/窗口而不是灯箱中打开。我用自己的代码和原始代码对它进行了测试。Fancybox图像在新窗口中打开/选项卡

自己的代码:http://www.demoeial.be/devversion/artikels/10369/Studentenraad-van-Louvain-la-Neuve-sluit-zich-weer-aan-bij-de-FEF.dhtml

原始代码:http://www.demoeial.be/devversion/fancybox/test.php

任何想法?我曾尝试添加/删除可能会干扰的代码,但我无法使其工作。

代码

<script type="text/javascript" src="http://www.demoeial.be/devversion/js/jquery.min.js"></script> 
<script type="text/javascript" src="http://www.demoeial.be/devversion/js/jquery.mousewheel-3.0.6.pack.js"></script> 
<script type="text/javascript" src="http://www.demoeial.be/devversion/js/fancybox/jquery.fancybox.js?v=2.1.1"></script> 
<link rel="stylesheet" type="text/css" href="http://www.demoeial.be/devversion/css/fancybox/jquery.fancybox.css?v=2.1.1" media="screen" /> 


<script type="text/javascript"> 
    $(document).ready(function() { 
     /* 

     /* 
     * Different effects 
     */ 

     // Change title type, overlay closing speed 
     $(".fancybox").fancybox(); 
     } 
</script> 

身体:你的HTML页面的

<div id='article'><div id='articletitle'>Studentenraad van Louvain-la-Neuve sluit zich weer aan bij de FEF</div> 
        <div class='publication_date'>Artikel gepubliceerd op 18 Oktober 2012 om 12:57</div><div id='sidebarpics'><a class='fancybox' href='http://media.demoeial.be/photos/2012/10/10369_509_xl.jpg' title='' rel='fancybox' ><img src='http://media.demoeial.be/photos/2012/10/10369_509_side.jpg' width='280' alt='' /></a><div class='imagedescription_side'></div></div> 
+0

你可以在这里发布你的代码吗?如果链接消失,问题将变得无关紧要。 – SomeKittens

回答

1

线19,你打开一个

$(document).ready(function() { 

但你不要关闭它

你应该有这样的代码:

$(document).ready(function() { 
    // Change title type, overlay closing speed 
    $(".fancybox").fancybox(); 
}); 

你会看到在例如Firebug控制台的错误。

+0

更新了代码,唉,不是解决问题的方法@Bixi – purplizer

+0

你应该安装萤火虫并检查控制台...现在你有另一个错误:'TypeError:$(“。fancybox”)。fancybox不是一个函数' –

+0

检查http://stackoverflow.com/questions/3992054/fancybox-is-not-a-function你正在加载jquery lib两次(一次加载fancybox和一次后= kaboom) –

相关问题