C# Ajax 我的天空
C#、Ajax、ASP.NET 、ASP疯狂追求者
博客园
::
首页
::
联系
::
订阅
::
管理
9 Posts :: 0 Stories :: 187 Comments :: 1 Trackbacks
公告
昵称：
高达小强
园龄：
5年4个月
粉丝：
3
关注：
0
搜索
常用链接
我的随笔
我的评论
我的参与
最新评论
我的标签
最新随笔
1. 阳光季节（AJAX+C#开源无DLL留言本）
2. 仿WINDWS无限级Ajax菜单树升级1.3版(修补了严重BUG)
3. 仿WINDWS无限级Ajax菜单树升级1.2版(菜单名支持非法字符)
4. 仿WINDWS无限级Ajax菜单树升级1.1版(添加了拖拽功能)
5. Ajax打造仿WINDWS无限级菜单树(asp.net2.0+C#+Access)
6. 在Ajax程序中实现无刷新换肤功能(asp.net2.0)
7. 按比例微缩图片的一段小小的JS代码
8. Ajax程序中,自己实现页面前进、后退、与标签功能(asp.net2.0)
9. 写下我的第一笔
随笔分类
(8)
Ajax(7)
Asp
C#.net
javascript(1)
随笔档案
(9)
2006年11月 (1)
2006年10月 (7)
2006年9月 (1)
积分与排名
积分 - 27497
排名 - 3850
最新评论
阅读排行榜
评论排行榜
推荐排行榜
按比例微缩图片的一段小小的JS代码
自己写的一个非常简单的图片微缩JS代码，当然网上有很多类似的代码，在此确实是献丑了。
主要方法写在SetImgSize.js里面
SetImgSize.js
1
//
智能微缩图片JS方法
2
//
参数：imgID（图片的标识ID）
3
//
参数：maxWidth（图片的最大宽度，值为0则表示不限制宽度）
4
//
参数：maxHeight（图片的最大高度，值为0则表示不限制高度）
5
function
setImgSize(imgID,maxWidth,maxHeight)
6
{
7
var
img
=
document.images[imgID];
8
if
(maxWidth
<
1
)
9
{
10
if
(img.height
>
maxHeight)
11
{
12
img.height
=
maxHeight;
13
}
14
return
true
;
15
}
16
if
(maxHeight
<
1
)
17
{
18
if
(img.width
>
maxWidth)
19
{
20
img.width
=
maxWidth;
21
}
22
return
true
;
23
}
24
if
(img.height
>
maxHeight
||
img.width
>
maxWidth)
25
{
26
if
((img.height
/
maxHeight)
>
(img.width
/
maxWidth))
27
{
28
img.height
=
maxHeight;
29
}
30
else
31
{
32
img.width
=
maxWidth;
33
}
34
return
true
;
35
}
36
}
功能实现原理是在图片加载完毕后（onload事件）用JS实现微缩。
下面是一个测试用的文件test.htm
test.htm
1
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
2
<
html
xmlns
="http://www.w3.org/1999/xhtml"
>
3
<
head
>
4
<
title
>
测试
</
title
>
5
<
script
language
="javascript"
type
="text/javascript"
src
="setImgSize.js"
></
script
>
6
</
head
>
7
<
body
>
8
限定了宽度150px
9
<
br
/><
img
alt
=""
id
="img1"
onload
="setImgSize('img1',150,0);"
src
="http://img.poco.cn/photo/20060602/972374149620060602140117_1.jpg"
/>
10
<
br
/>
限定了高度150px
11
<
br
/><
img
alt
=""
id
="img2"
onload
="setImgSize('img2',0,150);"
src
="http://img.poco.cn/photo/20060602/972374149620060602140117_4.jpg"
/>
12
<
br
/>
限定了高度150px、宽度150px
13
<
br
/><
img
alt
=""
id
="img3"
onload
="setImgSize('img3',150,150);"
src
="http://static.flickr.com/46/147572720_8b25471150_o.jpg"
/>
14
</
body
>
15
</
html
>
就写到这里了，呵呵，是不是很简单啊！
源码下载
SetImgSize.rar
绿色通道：
好文要顶
关注我
收藏该文
与我联系
posted on 2006-10-25 15:43
高达小强
阅读(932)
评论(2)
编辑
收藏
Feedback
582376
#1楼
2006-11-29 17:30
kiki[匿名][未注册用户]
我试了,好象没用
回复
引用
#2楼
[
楼主
]
2006-12-05 08:56
高达小强
@kiki[匿名]
源码上有示例哦！应该是可以用的
回复
引用
查看
注册用户登录后才能发表评论，请
登录
或
注册
，
返回博客园首页
。
首页
博问
闪存
新闻
园子
招聘
知识库
最新IT新闻
:
·
伊朗封杀Gmail和Facebook等互联网服务
·
分析称专利之争让谷歌苹果两败俱伤
·
Android平台发现新型手机病毒Rootsmart
·
HTC首款Android4.0手机大曝光
·
这是不是你期待的 iPad 3？
»
更多新闻...
最新知识库文章
:
·
高级编程语言的发展历程
·
如何学习一门新的编程语言？
·
学习不同编程语言的重要性
·
为什么我喜欢富于表达性的编程语言
·
计算机专业的女生为什么要学编程
»
更多知识库文章...
China-pub 2011秋季教材巡展
China-Pub 计算机绝版图书按需印刷服务
Copyright @ 高达小强
Powered by:
.Text
and
ASP.NET
Theme by:
.NET Monster