0

This is part of my code:

  <script type="text/javascript">
  $(document).ready(function(){
$('#slideshow').cycle({
fx: 'cover',
speed: 2500,
timeout: 2000
});
}); 
</script>

I want to use load function instead of ready, because I want my slideshow to be started after all images are completely loaded.

In stackoverflow question below, it's suggested to use this code:

Check if images are loaded?

$('.slideshow img').load(function(){
$('.slideshow').show().cycle();
});

and also display the images in the body tag as : none. when I apply this code to my own slideshow (without displaying the images as none), my slideshow doesn't start.

How I should write this code? Thanks

Nima
  • 191
  • 2
  • 3
  • 17

1 Answers1

1

You could try the following

$(window).load(function() {
   $('#slideshow').cycle({
     fx: 'cover',
     speed: 2500,
     timeout: 2000
   });
});

This should wait to all content and graphics are loaded before running the cycle.

Mark Walters
  • 12,060
  • 6
  • 33
  • 48
  • thank you a lot . It works . but I think i will have another problem because the images are in body tag and my script is separate from the html , before the slide show starts , images will form a queue from top to down of the slideshow div tag during the loading time. am I right ? because I'm working with localhost and speed is high , I don't know it happens or not . again thank you , anyway – Nima Nov 29 '13 at 13:32
  • Have a look here http://4loc.wordpress.com/2009/04/28/documentready-vs-windowload/ - $(window).load will wait until all content is loaded - meaning the HTLM has rendedred as well as all iFrames and Images etc. I don't understand what the issue would be?!? – Mark Walters Nov 29 '13 at 14:01
  • ok . thank you . if it includes all the content and components there will be no problem – Nima Nov 29 '13 at 14:45