/*********** (C)Scripterlative.com A Simple Reliable Image Preloader that actually pre-loads. (Many don't) Where applicable, allows files to be specified using a common path and/or extension. Produces a discreet error log for de-bugging. Installation ~~~~~~~~~~~~ Save this file as 'preloader.js' in a suitable folder. Within the section place these tags: (If preloader.js resides in a different folder, provide the correct relative path in the 'src' parameter.) Configuration ~~~~~~~~~~~~~ Also in the add tags as shown below: Syntax: To simplify data entry, there is the option to specify a common path and/or filename extension. THE KEY IS NOT TO SPECIFY THE SAME DATA TWICE. For instance if you specify a common path, don't add a path to any filenames. Similarly if you specify a common extension, don't give an extension to any file names. Example Uses ~~~~~~~~~~~~ Pre-load three images of different file types from the current folder: Pre-load three .jpg files from the current folder: Pre-load three .jpg files all from different folders: Pre-load three .jpg files from the 'myimages' subfolder: Debugging ~~~~~~~~~ The script writes the result of loading the specified files to the status line. Most browsers have status bar updating disabled by default, so you may have to enable it to see the results. In Firefox: Tools / Options / Content / Enable JavaScript --- [Advanced] / [x] Change status bar text To disable this feature, find the line starting with: 'window.status' and comment it out by preceding it with // . ---------- This code is free, however if you wish to reward the author and ensure the continued development of such scripts, you may make a donation at www.scripterlative.com. **** DO NOT EDIT ANYTHING BELOW *******/ function PreLoader( path, extn ) { /* Free download with instructions from: http://scripterlative.com?preloader */ this.store = []; this.path = path || ""; this.extn = extn || ""; this.init = function() { var loadCount = 0, errorCount = 0, errorLog = " Failed files: "; for(var i = 0, len = arguments.length; i < len; i++) { this.store[i] = new Image(/*28432953637269707465726C61746976652E636F6D*/); this.store[i].src = this.path + arguments[i] + this.extn; this.store[i].onload = function(){ loadCount++; result(); } this.store[i].onerror = function(){ errorCount++; errorLog += this.src + ' '; result(); } } function result() { window.status ='Loaded:'+ loadCount + ' | Errors:' + errorCount + ( errorCount ? errorLog : "" ); } } } /** End of listing **/