图片预加载效果的实现
作者:volcano 来源:某人的栖息地 发布时间:2008-06-16 12:08:00
标签:加载,图片,javascript
使用picasa的时候,注意到它首先是显示模糊的图片,然后图片突然变得清晰,这样做有一定的好处——picasa的图片翻页是用javascript实现的,如果直接载入大图,中间势必会有个空档,用户在这中间会感觉很空虚~~
于是我花了点时间,打探它的实现方式,发觉很简单,不是用的lowsrc之类的标记,而是简单的js。好用的JS图片预加载类
代码示例
<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.myImage.src = this.src;
}
如此这般,待大图载入完成之后,利用js替换原小图的src,就完成了图片预加载效果。关键点是图片的onload事件利用。


猜你喜欢
- 在并发编程中,多个Goroutine访问同一块内存资源时可能会出现竞态条件,我们需要在临界区中使用适当的同步操作来以避免竞态条件。Go 语言
- 一.入参解析库 argparse有时候写Python脚本,需要处理入参[-h][-v][-F]...等情况,如果自己来解析的话,会花费很多时
- 目录写在前面双向加密ENCODE/DECODEAES_ENCRYPT/AES_DECRYPTDES_ENCRYPT/DES_DECRYPT单
- 1.条件语句几个注意点和C#不一样的。if a < 5 { return 0} else {
- 快照复制是在数据库之间对数据以及数据库对象进行复制并进行同步,以确保多个数据库之间一致性的一个法宝。简单的说,快照复制就是实现把一个数据库服
- 描述Bootstrap Button(按钮)JavaScript 插件允许您加强按钮的功能。您可以控制按钮的状态,也可以为组件创建按钮组,比
- 比如说,name=John。在队列里,值和表单用一个&符号分开,空格用+号替换,特 殊的符号转换成十六进制的代码。因为这一队列在UR
- 电脑是64位的安装不了Windows (x86, 32-bit),Mysql installer MSI ,然后下载了Windo
- 需求描述制作一个H5页面,打开之后可以录音,并将录音文件提交至后台微信录音最长时长为1min微信官方文档--音频接口代码如下 /
- 中间件是我们在软件开发中的一个古老而强大的概念,当我们在应用程序中使用路由相关模式时,它非常有用。如果您不太了解中间件的含义,Nodejs框
- 一 模板语法传值方式一:# urls.pypath('template', views.template)# views.p
- 看了下函数本身的docgetattr(object, name[, default]) -> valueGet a named att
- 本文实例为大家分享了js实现微信聊天效果的具体代码,供大家参考,具体内容如下<!DOCTYPE html><html la
- Python的文件类型介绍:.py python的源代码文件.pyc Python源代码import后,编译生成的字节码.pyo Pytho
- 网页上的图片如果设置了alt属性,当鼠标移经时就会有tooltip出现,但是只能显示一行文本,有时需要多行文本,乃至图片来显示图片、链接或者
- 我认为,出现这个问题的原因有以下几点: 1、客户端禁用了cookie 2、浏览器出现问题,暂时无法存取cookie 3、php.ini中的s
- 本文的目的是讨论Python中 __new__ 和 __ini___ 的用法。 __new__ 和 __init__ 的区别主要表现在:1.
- 对于python2.7字符串在Python2.7内部的表示是unicode编码,因此,在做编码转换时,通常需要以unicode作为中间编码,
- string 对象 1、str.match(RegExp) 在str中搜索匹配RegExp的字符串并保存在一个数组内返回, 如果RegExp
- Python是一门简单易学的编程语言,语法简洁而清晰,并且拥有丰富和强大的类库。与其它大多数程序设计语言使用大括号不一样 ,它使用缩进来定义