Getting Nivo-slider to start before all images are loaded

问题

I am using the Nivo-slider Wordpress plugin, and love how it looks and how easy it is for my clients to use.

The only problem is that the slideshows do not play until all the images are loaded, which is a big problem as soon as you have more than a few images: http://www.marcusmcshane.com/

Does anyone know how to make the slideshow start after the first couple have loaded?

Thanks in advance for any help you can offer.

回答1:

Having had plenty of experience with Nivo Slider personally, I remember that they use $(window).load which I indeed saw you are still using too.

Change this:

<script type="text/javascript"> 
jQuery(window).load(function(){
    jQuery("#nivoslider-283").nivoSlider({
        effect:"fade",
        slices:15,
        boxCols:8,
        boxRows:4,
        animSpeed:500,
        pauseTime:3000,
        startSlide:0,
        directionNav:false,
        directionNavHide:true,
        controlNav:false,
        keyboardNav:true,
        pauseOnHover:true,
        manualAdvance:false
    });
});
</script>

to this:

<script type="text/javascript"> 
jQuery(function(){
    jQuery("#nivoslider-283").nivoSlider({
        effect:"fade",
        slices:15,
        boxCols:8,
        boxRows:4,
        animSpeed:500,
        pauseTime:3000,
        startSlide:0,
        directionNav:false,
        directionNavHide:true,
        controlNav:false,
        keyboardNav:true,
        pauseOnHover:true,
        manualAdvance:false
    });
});
</script>

回答2:

This is still relevant to each new Nivo Slider clean install & Caroline's solution works fine.

I keep an adjusted copy for design use with any tweaks (like the above) included, therefore no need to keep changing it.

Saving:

    jQuery(function(){
$('#slider').nivoSlider();   });

..as a separate file (nivo.js) & calling it from the html file means it's easily found to adjust or return to original if need be.

For added peace of mind define the height of a div (#slider) so the page doesn't pop around in slow loading browsers.

来源：https://stackoverflow.com/questions/6727253/getting-nivo-slider-to-start-before-all-images-are-loaded

标签

jquery

wordpress-plugin

nivo-slider