Preloading an array of images (in js)

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Jezternz
    New Member
    • Jan 2008
    • 145
    #1

    Preloading an array of images (in js)

    I have a way below, but it doesnt seem to work in Firefox or Chrome, any ideas? Improvements? Changes completly?

    Code:
    var wds_assets_for_preload = [
[0, "./images/buttons/drag_toolbar.gif"], 
[0, "./images/buttons/dropdown_mouseover.png"]
]
var CurrentImage = new Image();
for(var i = 0; i < wds_assets_for_preload.length; i++)
CurrentImage.src=wds_assets_for_preload[i][1];
    Thanks, Josh
    Tags: None
    • gits
      Recognized Expert Moderator Expert
      • May 2007
      • 5388
      #2
      could you tell a bit more - what is not working correctly? typically it is an async process and you may use an onload-handler in FF for example to be sure that the image is loaded before further processing ... like in the following example:

      [code=html]
      <html>
      <script type="text/javascript">

      function foo() {
      var i = new Image;

      i.onload = function() {
      document.getEle mentsByTagName( 'body')[0].appendChild(i) ;
      };

      i.src = 'http://www.google.de/intl/de_de/images/logo.gif';
      }

      </script>

      <body onload="foo();" >
      </body>

      </html>
      [/code]
      kind regards

        Comment

        • Jezternz
          New Member
          • Jan 2008
          • 145
          #3
          Im not sure, I just noticed, after this "preload" the images in IE7 that are dynamicly set come up instantly, and in ff, they slowly popup, I assumed this meant that the preload worked in IE? :S

          Thanks, Josh

            Comment

            • Dormilich
              Recognized Expert Expert
              • Aug 2008
              • 8694
              #4
              to check whether an image is completely loaded I'd go for the image.complete property....

              regards

                Comment

                • gits
                  Recognized Expert Moderator Expert
                  • May 2007
                  • 5388
                  #5
                  Originally posted by Jezternz
                  Im not sure, I just noticed, after this "preload" the images in IE7 that are dynamicly set come up instantly, and in ff, they slowly popup, I assumed this meant that the preload worked in IE? :S
                  i guess that is a caching issue ... just setting the src of an image loads the file but unless you use an onload or the complete-property you don't really 'know' when the sources are loaded completely.

                  kind regards

                    Comment

                    • xNephilimx
                      Recognized Expert New Member
                      • Jun 2007
                      • 213
                      #6
                      The json array is malformed!

                      Wrong:
                      [CODE="javascrip t"]
                      var wds_assets_for_ preload = [
                      [0, "./images/buttons/drag_toolbar.gi f"],
                      [0, "./images/buttons/dropdown_mouseo ver.png"]
                      ];
                      [/CODE]

                      Should be:
                      [CODE="javascrip t"]
                      var wds_assets_for_ preload = [
                      "./images/buttons/drag_toolbar.gi f",
                      "./images/buttons/dropdown_mouseo ver.png"
                      ];
                      [/CODE]

                      There are no literal indexes for arrays in json!

                        Comment

                        • gits
                          Recognized Expert Moderator Expert
                          • May 2007
                          • 5388
                          #7
                          ?? the OP just used an array that contains elements that are arrays itself ... and the construct is syntactically correct ... and even when it would be an ajax-response it would be correct syntax to be evaled when it is a string ... what if the first element of a subelement is needed for something else? how should it be transfered in such a structure that basicly seems to be an Array-structure? you just flattened the array and so dropped some information ... i think this would be a valid JSON-string in case it would be used as such ... but of course i could be wrong ;)

                          kind regards

                            Comment

                            • Jezternz
                              New Member
                              • Jan 2008
                              • 145
                              #8
                              yehhh, I have the 0's there as my array was a bunch of assets to preload. "0" just meant image, so they are supposed to be there :S

                                Comment

                                • gits
                                  Recognized Expert Moderator Expert
                                  • May 2007
                                  • 5388
                                  #9
                                  does it work with an onload or checking for the complete-property?

                                  kind regards

                                    Comment

                                    • Jezternz
                                      New Member
                                      • Jan 2008
                                      • 145
                                      #10
                                      Havent had any luck :( Have decided to scrap the image preload for now, I will likely try again later, bring this thread back up.again.

                                        Comment

                                        Previous template Next
                                        Working...