作者：volcano 来源：某人的栖息地 酷勤网收集 2008-07-06
摘要
使用picasa的时候，注意到它首先是显示模糊的图片，然后图片突然变得清晰，这样做有一定的好处——picasa的图片翻页是用javascript实现的，如果直接载入大图，中间势必会有个空档，用户在这中间会感觉很空虚~~
使用picasa的时候，注意到它首先是显示模糊的图片，然后图片突然变得清晰，这样做有一定的好处——picasa的图片翻页是用javascript实现的，如果直接载入大图，中间势必会有个空档，用户在这中间会感觉很空虚~~
于是我花了点时间，打探它的实现方式，发觉很简单，不是用的lowsrc之类的标记，而是简单的js。
代码示例
CODE:
-
<img id="myImage" src="small_144.jpg" width="640" />
-
var img = new Image();
-
img.src = "http://imghost/big_640_480.jpg";
-
img.onload = function() {
-
document.getElementById('myImage').src = this.src;
-
}
如此这般，待大图载入完成之后，利用js替换原小图的src，就完成了图片预加载效果。关键点是图片的onload事件利用。
来自：图片预加载效果的实现
Oh-Cool 于 2008-06-16 @ 23:53:29 留言 ：
代码罐头 于 2008-06-17 @ 13:49:26 留言 ：