一页上的Fancybox和Nivo滑块不起作用 [英] Fancybox and Nivo slider on one page not working

问题描述

我想在我的网站横幅中实现一个简单的Nivo幻灯片演示，并在其下方实现一个fancybox画廊-我只是不能让他们同时工作. Nivo滑块具有首选项，当我禁用它时，fancybox画廊可以工作.我正在使用fancybox v2(jquery 1.7.2)和nivo滑块jquery 1.7.1-这是问题吗?我的jquery和js技能非常初级，所以请为我拼写-非常感谢！ 这是测试站点: http://designasite.co.za/aerialphotographer/

I want to implement a simple Nivo slideshow in the banner of my site and a fancybox gallery below it - I just can't get them to work simultaneously. The Nivo slider takes preference, when I disable it, the fancybox gallery works. I am using fancybox v2 (jquery 1.7.2) and nivo slider jquery 1.7.1 - is that the problem? My jquery and js skills are seriously rudimentary, so please spell it out for me - thank you so much! Here is the test site: http://designasite.co.za/aerialphotographer/

推荐答案

我会尝试清理您的jQuery，尝试一下:

I would try cleaning up your jQuery, give this a try:

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

        $('#slider').nivoSlider({
            effect: 'fade', // Specify sets like: 'fold,fade,sliceDown'
            animSpeed: 1000, // Slide transition speed
            pauseTime: 3000, // How long each slide will show
        });

    });
</script>   

此外，删除

<script type="text/javascript" src="scripts/jquery-1.7.1.min.js"></script>  

在您当前的nivo滑块插件所在的位置并进行了初始化，并移动了

Above where your current nivo slider plugin is being included and initialised and also move the

<script type="text/javascript" src="scripts/jquery.nivo.slider.pack.js"></script>

与其他包含的文件一起放入您的head标记.

into your head tag along with your other included files.

这样做的原因是，您只应该包含一次jQuery，并且在页面上也只能使用一个版本，并且最好同时包含所有插件和css文件，这是一个好习惯，通常建议您实际包含jQuery插件在页面底部，这样不会降低初始页面的加载速度，但是无论您在哪里，都可以将它们放置在同一位置，以便更轻松地找到它们.

The reason for this is that you should only include jQuery once and use only one version on a page aswell and it's good practise to include all your plugins and css files at the same time, it's usually recommended to actually include your jQuery plugins at the bottom of your page so that it doesn't slow down your initial page from loading but wherever you have it, keep them together in the same place so that they are easier to find.

这篇关于一页上的Fancybox和Nivo滑块不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！