最近做的东西需要把大图片缩小成不同大小的图片,感觉生成小图片有点浪费资源,而且以后需要不同大小的图片时还要重新生成,不如在前台控制好,这样也灵活。于是就在<img>中加了个onload的事件来在浏览器载入的过程中修改图片的大小,但经过测试发现,onload事件经常没起作用。在网上看了一圈改成下面这个样子
1 // JScript 文件
2 //Zeit:2007_09_17
3 //Ort:shtianxin.com
4 //Tunesmith:a4647
5 //Funktion:利用脚本动态改变显示图片的大小,由于img在onload事件上的不灵敏,增加settimeout函数,并用style.display,ie6,firefox2.0.0.7测试通过
6 // 控制显示
7 /**//*
8 功能:修改 window.setTimeout,使之可以传递参数和对象参数
9 使用方法: setTimeout(回调函数,时间,参数1,,参数n)
10 */
11 var __sto = setTimeout;
12 window.setTimeout = function(callback,timeout,param){//由于与其他如dropdownlist调用的setTimeout函数冲突,增加参数判断,否则会出错
13 if(param)
14 {
15 var args = Array.prototype.slice.call(arguments,2);
16 var _cb = function(){
17 callback.apply(null,args);
18 }
19 __sto(_cb,timeout);
20 }
21 else
22 {
23 __sto(callback,timeout);
24 }
25 }
26 /*
27 function resize_image(img_id,limit_width,limit_height)
28 {
29 var width,height;
30 if (img_id)
31 {
32 width=img_id.width;
33 height=img_id.height;
34 if(width/height>limit_width/limit_height)
35 {if(width>limit_width) img_id.width=limit_width;}
36 else
37 {if(height>limit_height) img_id.height=limit_height;}
38 }
39 }
40 */
41
42 function DT_image(img_id,limit_width,limit_height)
43 {
44
45 var width,height;
46 if (img_id)
47 {
48 width=img_id.width;
49 height=img_id.height;
50 if(width/height>limit_width/limit_height)
51 {if(width>limit_width) img_id.width=limit_width;}
52 else
53 {if(height>limit_height) img_id.height=limit_height;}
54
55 }
56
57 }
58
59 function resize_image(img_id,limit_width,limit_height)
60 {
61 if(img_id)
62 {
63 var o=img_id;
64 //'+img_id+',\''+limit_width +'\',\''+ limit_height +'\'
65 img_id.style.display="none";
66 //setTimeout("DT_image(" + img_id + "," +limit_width + "," + limit_height+ ")", 20);
67 //eval('window.setTimeout("DT_image('+o+',\''+limit_width +'\',\''+ limit_height +'\')",20)');参数不能是对象
68 window.setTimeout(DT_image,50,img_id,limit_width,limit_height);
69 img_id.style.display="";
70 }
71 }
72
73
74
75
2 //Zeit:2007_09_17
3 //Ort:shtianxin.com
4 //Tunesmith:a4647
5 //Funktion:利用脚本动态改变显示图片的大小,由于img在onload事件上的不灵敏,增加settimeout函数,并用style.display,ie6,firefox2.0.0.7测试通过
6 // 控制显示
7 /**//*
8 功能:修改 window.setTimeout,使之可以传递参数和对象参数
9 使用方法: setTimeout(回调函数,时间,参数1,,参数n)
10 */
11 var __sto = setTimeout;
12 window.setTimeout = function(callback,timeout,param){//由于与其他如dropdownlist调用的setTimeout函数冲突,增加参数判断,否则会出错
13 if(param)
14 {
15 var args = Array.prototype.slice.call(arguments,2);
16 var _cb = function(){
17 callback.apply(null,args);
18 }
19 __sto(_cb,timeout);
20 }
21 else
22 {
23 __sto(callback,timeout);
24 }
25 }
26 /*
27 function resize_image(img_id,limit_width,limit_height)
28 {
29 var width,height;
30 if (img_id)
31 {
32 width=img_id.width;
33 height=img_id.height;
34 if(width/height>limit_width/limit_height)
35 {if(width>limit_width) img_id.width=limit_width;}
36 else
37 {if(height>limit_height) img_id.height=limit_height;}
38 }
39 }
40 */
41
42 function DT_image(img_id,limit_width,limit_height)
43 {
44
45 var width,height;
46 if (img_id)
47 {
48 width=img_id.width;
49 height=img_id.height;
50 if(width/height>limit_width/limit_height)
51 {if(width>limit_width) img_id.width=limit_width;}
52 else
53 {if(height>limit_height) img_id.height=limit_height;}
54
55 }
56
57 }
58
59 function resize_image(img_id,limit_width,limit_height)
60 {
61 if(img_id)
62 {
63 var o=img_id;
64 //'+img_id+',\''+limit_width +'\',\''+ limit_height +'\'
65 img_id.style.display="none";
66 //setTimeout("DT_image(" + img_id + "," +limit_width + "," + limit_height+ ")", 20);
67 //eval('window.setTimeout("DT_image('+o+',\''+limit_width +'\',\''+ limit_height +'\')",20)');参数不能是对象
68 window.setTimeout(DT_image,50,img_id,limit_width,limit_height);
69 img_id.style.display="";
70 }
71 }
72
73
74
75