Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Jun 2002
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Image Preloading

    I am using javascript to display random images. Whenever I load the page it shows broken images and then it loads the picture. My script is:

    Code:
    <script>
    var Top = new Array("images/top_1.gif","images/top_2.gif","images/top_3.gif","images/top_4.gif");
    var Bottom = new Array("images/bottom_1.gif","images/bottom_2.gif","images/bottom_3.gif","images/bottom_4.gif");
    imgCt = Top.length;
    function choosePictures()
    {
    if(document.images)
    {
    randomNum = Math.floor((Math.random() * imgCt));
    document.imgTop.src = Top[randomNum];
    document.imgBottom.src = Bottom[randomNum];
    }
    }
     </script>
    My images look like this:
    <img src="" name="imgTop" width="770" height="103" />
    <img src="" name="imgBottom" width="770" height="25" />

    The choosePictures() function is called in the body tag onload. If I set the src for both imgs to the first images it shows the first images and then about a second later loads the new random image. Is there a way to tell the browser to wait and display the page only whenever the images are done loading? I've searched javascript site but I don't understand alot of what they write. Thanks

  • #2
    Regular Coder
    Join Date
    Jul 2002
    Location
    USA
    Posts
    151
    Thanks
    0
    Thanked 0 Times in 0 Posts
    If you give img tags a blank src, they will display a broken image. Instead, give them the src for a transparent 1x1 image, which can then be replaced.

    <img src="blank.gif" name="imgTop" width="770" height="103" />

  • #3
    New Coder
    Join Date
    Jun 2002
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts
    duh! how dumb of me. I should have thought of that. Thanks algorithm.


  •  

    Posting Permissions

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