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 2 of 2
  1. #1
    Regular Coder
    Join Date
    Jul 2002
    Posts
    124
    Thanks
    0
    Thanked 0 Times in 0 Posts

    pre-loading on other pages

    I've seen various Q&As on various forums about pre-loading images here, but at my level of complete Javascript beginner...well, so many options are just confusing. I'm not sure even which apply to my situation, so I hope someone can give me a simple answer.

    On my top page there's a link to a 'photos' page. On that page will be maybe 20 thumbnails. The user can click on any one and a bigger version will appear in the frame. I've put each large version on its own HTML page (not how the experts would do it, I'm sure, but it's sufficient). On each of the pages are back and forward arrows so the viewer can cycle through the bigger pics in the order of the thumbnails (I'm using LOWSRC, by the way).

    What I want is to put some code on each page to pre-load the next and previous 2 (more?) pictures in the cycle, for the obvious reason. So can I just use the simple

    <script language="javascript">
    <!--
    img01=newImage();
    img01.src=images/image1.jpg;
    img02=newImage();
    img02.src=images/image2.jpg ;
    ...
    //-->
    </script>

    on each page? I'm under the impression it doesn't work if the images are on another page (I'm wondering if a link can be followed to cache from a new page, even if the url is the same), but I could be completely misguided.

    Also, if I preload images should I delete all the LOWSRC references?

    Thanks for any help.

  • #2
    Regular Coder
    Join Date
    Jul 2002
    Posts
    124
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post Pre-loading for other pages - it works

    Thanks a lot, Dave. The code below appears to cache images for another page. I know it works because I can see it working. Without pre-loading, my computer is slow enough that I can see the "alt" title before an image loads, but with the pre-loading the images come up immediately. (And of course the low res images are not necessary).

    <head>
    <script language="javascript">
    <!--
    //images for use on another page
    function preload(){
    image1=new Image(h,w);
    image1.src="../photos/photo1.jpg";
    image2=new Image(h,w);
    image2.src="../photos/photo2.jpg";
    }
    //-->
    </script>
    </head>
    <body onLoad="preload();">


  •  

    Posting Permissions

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