Background loading of image to cache by using JavaScript image objectWe will be using image object to download the image. One of its property src downloads the image. Here is the image object declaration and then downloading of image.
The above line will download the image to cache, we will try to connect displaying of this image with one event to see how fast the image loads. To do this we will have one simple function like this.
Once this function is called the image is displayed through a image tag (name = ) im. We will connect this function to one button onclick event like this.
To load the images while the page is loading we will use onload event of body tag. Here is the complete code. Replace the image urls of your choice. You will see the first image while page loads and allow some time for the remote image to load. Watch your status bar for messages and downloading of remote image file. Once you click the button the second image will display immediately with out any delay as it comes from the cache. If you are in a slow internet you can see the difference clearly. If you are in a fast net then try to connect to a heavy image to get the difference in speed. These concept will help us in building a JavaScript image slide show. Here is the complete code.
Subscribe to our YouTube Channel here
This article is written by plus2net.com team.
|
More on JavaScript Image Object Image SlideShow Script using navigational buttons Image Loading to cache while page load by Image object Reloading the image without refreshing the page Image Rotator Script for automatic Slideshow Image Move across by button click Image Move continuously across screen Image offSetLeft and offSetTop to get position of the image from left and top Image Position : Positioning an image by assigning value to style.top and style.left Image width: Managing width of the image Image height: managing height of the image Image align: Image align left or right Image border: adding and removing border from Image Image alt: updating or reading alt message of image |