inexplicably inextricable » 日志 » javascript preload images
javascript preload images
inexplicable 发表于 2008-05-29 23:01:29
if you have some images urls & u'd like to load them before user could actually see them, u'd try sth like the following:
//------------------------
var img = new Image();
img.src = _img_url;
//------------------------
if you'd like to prevent user from seeing red cross as you can't promise if the images are available, u'd try sth like the following:
//------------------------
var img = new Image();
img.onerror = function(){/*handle image load errors, possibly switching src to another save backup image*/};
img.src = _img_url;
//------------------------
if you'd like to detect image width/height for the sake of either image size adjust or container size adjust, u'd try some more:
//------------------------
var img = new Image();
img.onload = function(){
//check cache if img loaded, and read width & height then return
//if IE6 or below, check img.complete till it's true by use of window.setTimeout recursively
//read width & height from img, update cache then return
};
img.src = _img_url;
//------------------------
the reason why we'd like to cache the width & height info is to prevent IE from too much recursion
the reason why we need recursive timed check for image complete is for IE onload happens before image gets completely loaded and could give much smaller width/height value than the actual
诶,搞js 难啊,IE 还活着
//------------------------
var img = new Image();
img.src = _img_url;
//------------------------
if you'd like to prevent user from seeing red cross as you can't promise if the images are available, u'd try sth like the following:
//------------------------
var img = new Image();
img.onerror = function(){/*handle image load errors, possibly switching src to another save backup image*/};
img.src = _img_url;
//------------------------
if you'd like to detect image width/height for the sake of either image size adjust or container size adjust, u'd try some more:
//------------------------
var img = new Image();
img.onload = function(){
//check cache if img loaded, and read width & height then return
//if IE6 or below, check img.complete till it's true by use of window.setTimeout recursively
//read width & height from img, update cache then return
};
img.src = _img_url;
//------------------------
the reason why we'd like to cache the width & height info is to prevent IE from too much recursion
the reason why we need recursive timed check for image complete is for IE onload happens before image gets completely loaded and could give much smaller width/height value than the actual
诶,搞js 难啊,IE 还活着
相关日志:
收藏:
QQ书签
del.icio.us
订阅:
Google
抓虾


