为了上帝的爱,我需要帮助!我试图让 Caroufredsel 和 fancybox 像他们在这里一样一起工作:
http://caroufredsel.frebsite.nl/examples/carousel-lightbox-tooltip.php
...但我只能让他们独立工作。我真的不知道javascript所以我失败了:(
这是我尝试实现它的地方:
目前只有 Caroufredsel 正在工作。如果我删除所有 Caroufredsel 代码,Fancybox 就可以工作。
为了上帝的爱,我需要帮助!我试图让 Caroufredsel 和 fancybox 像他们在这里一样一起工作:
http://caroufredsel.frebsite.nl/examples/carousel-lightbox-tooltip.php
...但我只能让他们独立工作。我真的不知道javascript所以我失败了:(
这是我尝试实现它的地方:
目前只有 Caroufredsel 正在工作。如果我删除所有 Caroufredsel 代码,Fancybox 就可以工作。
您jQuery
在第 15 行和第 189 行(查看源代码)两次引用库,这导致对fancybox
之前添加的插件的所有引用都丢失了(因为jQuery
变量在您第二次包含时重新定义jQuery
)。去除
<script type="text/javascript" src="js/jquery.js"></script>
在第 189 行,你应该被设置。
首先:
您正在加载 jQuery(Javascript 库)两次。一次在您的<head>
部分 ( <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
) 中,一次在您的结束</body>
标记 ( <script type="text/javascript" src="js/jquery.js"></script>
) 之前。删除最后一个并将第一个更新为最新版本的 jQuery,如下所示:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
第二:
给你的脚本提供更好的结构可能会更好:或者你把它们全部加载到你的脑海中,或者在结束</body>
标记之前加载它们。这样,您就不会查看您不希望它们出现的地方的脚本。最佳实践通常被称为在结束</body>
标记之前包含所有脚本。不要忘记在所有其他脚本之前加载 jQuery!在您的情况下,它看起来像这样:
<footer>...</footer>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.carouFredSel.js"></script>
<script type="text/javascript" src="/fancybox/jquery.fancybox.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#foo2").carouFredSel({
circular: true,
infinite: false,
auto: false,
prev: {
button: "#foo2_prev",
key: "left"
},
next: {
button: "#foo2_next",
key: "right"
},
pagination: "#foo2_pag"
});
$('.fancybox').fancybox();
});
</script>