jquery预加载图片的方法

这篇文章主要介绍了jquery预加载图片的方法,涉及jQuery操作图片的相关技巧,需要的朋友可以参考下

本文实例讲述了jquery预加载图片的方法。分享给大家供大家参考。具体如下：

这段代码可以在页面打开前对图片进行预加载，这个函数非常有用，可以给用户带来更好的体验。

1. function preloadImages(oImageList, callback) { 
2. if ( typeof (oImageList) == 'object' && typeof (callback) === "function") { 
3. var iCallbackAfter = oImageList.length; 
4. var iPreloadInterval = window.setInterval(function() { 
5. if (iCallbackAfter === 0) { 
6. window.clearInterval(iPreloadInterval); 
7. callback(); 
8. } 
9. }, 100); 
10. $.each(oImageList, function(iIndex, sImage) { 
11. oImageList[iIndex] = new Image(); 
12. oImageList[iIndex].onload = function(oResult) { 
13. iCallbackAfter--; 
14. }; 
15. oImageList[iIndex].onabort = function(oResult) { 
16. console.log(oResult); 
17. }; 
18. oImageList[iIndex].onerror = function(oResult) { 
19. console.log(oResult); 
20. }; 
21. if (!sImage.match('http://')) { 
22. sImage = sImage; 
23. } 
24. oImageList[iIndex].src = sImage; 
25. }); 
26. } 
27. } 

希望本文所述对大家的jQuery程序设计有所帮助。