Results 1 to 2 of 2

Thread: Background Image Slideshow

  1. #1
    Join Date
    Dec 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Background Image Slideshow

    Background Image Slideshow
    ......................................

    <script language="JavaScript1.2">

    //Background Image Slideshow- Dynamic Drive (www.dynamicdrive.com)
    //For full source code, 100's more DHTML scripts, and TOS,
    //visit http://www.dynamicdrive.com

    //Specify background images to slide
    var bgslides=new Array()
    bgslides[0]="bgslide01.jpg"
    bgslides[1]="bgslide02.jpg"
    bgslides[2]="bgslide03.jpg"

    //Specify interval between slide (in miliseconds)
    var speed=5000

    //preload images
    var processed=new Array()
    for (i=0;i<bgslides.length;i++){
    processed[i]=new Image()
    processed[i].src=bgslides[i]
    }

    var inc=-1

    function slideback(){
    if (inc<bgslides.length-1)
    inc++
    else
    inc=0
    document.body.background=processed[inc].src
    }

    if (document.all||document.getElementById)
    window.onload=new Function('setInterval("slideback()",speed)')

    </script>

    ......................................

    hi, i found this script and would like to use it -
    when i load the site there is no picture -
    it takes too much time before the slideshow starts.
    is it possible to delete the preload time ?
    (all pictures are still preloaded on the site before)

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    The preload will take no time if the images are already loaded. Even if they're not loaded, the script doesn't wait until they are to start. The delay is because the script uses setInterval(), which waits until the first interval has passed to do anything. There's a way around that. And, if you put the script as the last thing before the closing </body> tag, you don't even need to wait for the window to load either. I'm taking your word for it that the images are already loaded, but it doesn't really matter. If you make these changes and the images aren't ready yet, it will just take until they load to show up. Background images have no layout and show no broken image tokens, so things will be OK until they do show up.

    OK, for the first part, change this:

    Code:
    if (document.all||document.getElementById)
     window.onload=new Function('setInterval("slideback()",speed)')
    to:

    Code:
    if (document.all||document.getElementById)
     window.onload=function(){slideback(); setInterval(slideback, speed);};
    If you place the script as the last thing before the closing </body> tag, you can change it to:

    Code:
    if (document.all||document.getElementById){
     slideback();
     setInterval(slideback, speed);
    }
    and it will start even faster. But the images will only show up if they're truely loaded. If not though, they will have plenty of time to load with 5000 milliseconds between image changes. In any case things should be a bit faster than the original script.

    Also a fine point - the language attribute for the script tag has been deprecated, and most DOCTYPES require the type attribute. You should change:

    Code:
    <script language="JavaScript1.2">
    to:

    Code:
    <script type="text/javascript">
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •