最近更新
阅读排行
关注本站

new Image的用法

阅读:2589 次   编辑日期:2013-12-20

目录:

概述:

今天咱们讲一讲图片预加载的方法,在对用户体验越来越高的今天,图片欲加载在日常的工作越来越重要,因为不能让用户在看到图片之前等待太多的时间。所以今天咱们聊一聊JS 的 new Image()对象。

为什么要用图片预加载:

其实在概述中也已经说了一个原因了,就是尽量减少用户等待时间。还有一点原因就是对JS效果的优化,试想一下:如果有一个鼠标经过替换图片的mouseover效果,但是图片过大的话岂不是要等一段时间之后替换的图片才会出现? 如果这张图片之前就已经加载好了呢?是不是JS的效果就会好很多~

new Image()对象:

	JS://
	function imgLoad(){
		uw3cImage = new Image();
		uw3cImage.src = "uw3c.jpg";
	}
	HTML://
	<body onLoad="javascript:imgLoad()">
    
        
    </body>
这样以来,图片会默认显示一张图片,等mouseover的时候需要替换的图片在onLoad的时候已经替换好了,这样就起到了欲加载的效果。
将本篇文章分享到:
top