Question

我有一个网站。有些页面有滑块，有些页面没有。我有这个问题与nivo滑块。有时，无法弄清楚什么时候，滑块没有加载，所以没有显示图像。如果再次单击同一页面，滑块正确加载，一切正常。问题不是标准问题，您必须通过导航到所有页面多次尝试。请查看它，从菜单栏访问所有页面花1-2分钟，这样你就可以看到问题。 Chrome-IE更常出现问题。链接位于http://www.secureshop.gr/POOL/citycars/website

提前谢谢。

Answer 1

可能会在正文的 BASE 处加载Nivo的脚本，以确保它不会在head中运行并导致任何类型的timeout的问题。

只要DOM知道有img，它就会继续，并且该图片会在其同时继续加载HTML的其余部分时加载。也许所有img都没有下载，因此Nivo Slider无法正确呈现。

<script type="text/javascript" src="js/jquery.nivo.slider.pack.js"></script>
<script>
    $('#slider').nivoSlider({
        effect: 'fade', // Specify sets like: 'fold,fade,sliceDown'
        slices: 15, // For slice animations
        boxCols: 8, // For box animations
        boxRows: 4, // For box animations
        animSpeed: 500, // Slide transition speed
        pauseTime: 5000, // How long each slide will show
        startSlide: 0, // Set starting Slide (0 index)
        directionNav: true, // Next & Prev navigation
        directionNavHide: true, // Only show on hover
        controlNav: false, // 1,2,3... navigation
        controlNavThumbs: false, // Use thumbnails for Control Nav
        controlNavThumbsFromRel: true, // Use image rel for thumbs
        controlNavThumbsSearch: '.jpg', // Replace this with...
        controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src
        keyboardNav: true, // Use left & right arrows
        pauseOnHover: true, // Stop animation while hovering
        manualAdvance: false, // Force manual transitions
        captionOpacity: 0.8, // Universal caption opacity
        prevText: '', // Prev directionNav text
        nextText: '', // Next directionNav text
        randomStart: false, // Start on a random slide
        beforeChange: function(){}, // Triggers before a slide transition
        afterChange: function(){}, // Triggers after a slide transition
        slideshowEnd: function(){}, // Triggers after all slides have been shown
        lastSlide: function(){}, // Triggers when last slide is shown
        afterLoad: function(){} // Triggers when slider has loaded
    });
</script>
</body>

Nivo滑块有时无法正常工作

1 个答案: