www.webdeveloper.com
Results 1 to 2 of 2

Thread: generating images onload

Hybrid View

  1. #1
    Join Date
    Apr 2011
    Posts
    1

    generating images onload

    I am developing a website where I have about 40 200K images to load and I got tiny squares in the bottom that when you mouseover them, the image viewer changes to the corresponding of this 200K images... so what i want to do is to load the entire page, and when that is done, start loading these images one by one.. and when each one of these loads, inmediately display the little square link that displays it (so that i would never have the problem that a user mouses over a square that displays an image that is not yet loaded) and since the little squares are one next to the other, it would slightly simmulate the effect of a loading bar..

    I don't know much about javascript so this is what I came up with:

    // I call this function from body onload=""
    /* the parameter imgArray is an array that has the name of a product
    and the function show_something(tvalue) simply changes style to display:block
    */

    function createImages(imgArray) {
    var objArray = new Array();
    var tvalue = 0;

    for(i=0;i<imgArray.length;i++) {
    // I used a loop since there are about 40-50 images
    obj = objArray[i];
    obj = new Image();
    tvalue = imgArray[i];
    obj.src = "_images/products/" + tvalue + ".png";
    obj.onload = show_something(tvalue);
    }
    }

    In firefox and chrome it works halfway.. the page loads, then the images start loading but the little squares get displayed all at once, not one by one when each corresponding image is loaded.. and in my beloved internet explorer, only one little square loads I already spent hours trying to solve this, I need help!

    Thank you!

  2. #2
    Join Date
    Apr 2011
    Location
    I live in the pinaple under the sea
    Posts
    107
    I guess loading your image in the cache before your script process is the best way you can do

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles