0

I am finding a lot of non-vanilla and non answered, question of how to guarantee that the image(s) are fully loaded and ready for use.

I am writing a game and need to have all images loaded before starting the game.

I have a vague recallection that there was some sort of hack of checking the height of the image.

If there actually is a js vanilla answer to this, my apologies for the double post.

Michael
  • 119
  • 1
  • 13
  • Maybe try this, answered from another stackoverflow question [This looks vanilla enough](http://stackoverflow.com/questions/3646036/javascript-preloading-images) – amberl May 12 '17 at 18:45
  • Will try that amberl, thanks – Michael May 12 '17 at 18:50
  • If you gather all the images, like with `document.images`, you can then maintain a counter that gets incremented when each image finishes. When the counter equals the size of the collection of images, you're complete. There are 3 ways an image may be complete. Either it is already cached, which means its `.complete` property of the image should be `true`, it successfully finishes loading, invoking its `onload` event, or there's an error, invoking its `onerror` event. –  May 12 '17 at 18:51

0 Answers0