Is there something like a ready event when an image in html is loaded and rendered?

Issue

I am creating a webview app for iPad, and want to show a splashscreen until index file and a set of images is loaded and rendered.

I want this splashscreen to disappear when all images is loaded and rendered - so the user doesn't see the typical image loading and rendering of non cached images.

Is there an event in browsers for image rendering done I can catch, or is there any Javascript plugin out there that can do this?

Solution

There are two event listeners DOMContentLoaded and load. The load event fires when all files have finished loading from all resources, including ads and images. The images are rendered during download, so this should be what you are looking for.

See the demo here

Answered By - Bakudan