js 图片等比例缩放代码


Posted in Javascript onMay 13, 2010
var scaleImage = function(o, w, h){ 
var img = new Image(); 
img.src = o.src; 
if(img.width >0 && img.height>0) 
{ 
if(img.width/img.height >= w/h) 
{ 
if(img.width > w) 
{ 
o.width = w; 
o.height = (img.height*w) / img.width; 
} 
else 
{ 
o.width = img.width; 
o.height = img.height; 
} 
o.alt = img.width + "x" + img.height; 
} 
else 
{ 
if(img.height > h) 
{ 
o.height = h; 
o.width = (img.width * h) / img.height; 
} 
else 
{ 
o.width = img.width; 
o.height = img.height; 
} 
o.alt = img.width + "x" + img.height; 
} 
} 
}

HTML
<div> 
<p><img src="../comment/img/max.jpg" onload="scaleImage(this,300,300)" alt="pic" /></p> 
<p><img src="../comment/img/2.jpg" onload="scaleImage(this,300,300)" /></p> 
<p><img src="../comment/img/3.jpg" onload="scaleImage(this,300,300)" /></p> 
<p><img src="../comment/img/4.jpg" onload="scaleImage(this,300,300)" /></p> 
</div>
Javascript 相关文章推荐
jquery select(列表)的操作(取值/赋值)
Aug 06 Javascript
jquery键盘事件介绍
Jan 31 Javascript
javascript中判断一个值是否在数组中并没有直接使用
Dec 17 Javascript
js Math 对象的方法
Sep 01 Javascript
jQuery仿Flash上下翻动的中英文导航菜单实例
Mar 10 Javascript
javascript实现五星评价代码(源码下载)
Aug 11 Javascript
Bootstrap选项卡与Masonry插件的完美结合
Jul 06 Javascript
使用jQuery5分钟快速搞定双色表格的简单实例
Aug 08 Javascript
通过实例了解js函数中参数的传递
Jun 15 Javascript
记录微信小程序 height: calc(xx - xx);无效问题
Dec 30 Javascript
JS+DIV实现拖动效果
Feb 11 Javascript
vue实例的选项总结
Jun 09 Javascript
跨浏览器开发经验总结(四) 怎么写入剪贴板
May 13 #Javascript
跨浏览器开发经验总结(三)   警惕“IE依赖综合症”
May 13 #Javascript
JavaScript prototype属性使用说明
May 13 #Javascript
js 实现复制到粘贴板的功能代码
May 13 #Javascript
js href的用法
May 13 #Javascript
解决IE下select标签innerHTML插入option的BUG(兼容IE,FF,Opera,Chrome,Safari)
May 13 #Javascript
Js 随机数产生6位数字
May 13 #Javascript
You might like
PHP json_encode() 函数详解及中文乱码问题
2015/11/05 PHP
PHP之图片上传类实例代码(加了缩略图)
2016/06/30 PHP
JS 删除字符串最后一个字符的实现代码
2014/02/20 Javascript
JavaScript的作用域和块级作用域概念理解
2014/09/21 Javascript
创建、调用JavaScript对象的方法集锦
2014/12/24 Javascript
JavaScript中用于四舍五入的Math.round()方法讲解
2015/06/15 Javascript
js剪切板应用clipboardData实例解析
2016/05/29 Javascript
微信小程序 页面之间传参实例详解
2017/01/13 Javascript
jQuery实现贪吃蛇小游戏(附源码下载)
2017/03/04 Javascript
vue-cli项目根据线上环境分别打出测试包和生产包
2018/05/23 Javascript
使用vuepress搭建静态博客的示例代码
2019/02/14 Javascript
小程序异步问题之多个网络请求依次执行并依次收集请求结果
2019/05/05 Javascript
vue element 中的table动态渲染实现(动态表头)
2019/11/21 Javascript
Ant Design Pro 下实现文件下载的实现代码
2019/12/03 Javascript
Vue+webpack实现懒加载过程解析
2020/02/17 Javascript
微信小程序录音实现功能并上传(使用node解析接收)
2020/02/26 Javascript
基于postman获取动态数据过程详解
2020/09/08 Javascript
VueCli生产环境打包部署跨域失败的解决
2020/11/13 Javascript
[02:34]2016完美“圣”典风云人物:BurNIng专访
2016/12/10 DOTA
linux系统使用python监测系统负载脚本分享
2014/01/15 Python
Python导入oracle数据的方法
2015/07/10 Python
Python3 log10()函数简单用法
2019/02/19 Python
详解Python中的内建函数,可迭代对象,迭代器
2019/04/29 Python
Python3enumrate和range对比及示例详解
2019/07/13 Python
CSS3制作hover下划线动画
2017/03/27 HTML / CSS
新闻专业个人求职信
2013/12/19 职场文书
党的群众路线教育实践活动学习心得体会
2014/03/03 职场文书
座谈会主持词
2014/03/20 职场文书
庆元旦活动总结
2014/07/09 职场文书
感恩教师节演讲稿
2014/09/03 职场文书
贫困证明书范文
2015/06/16 职场文书
学习杨善洲同志先进事迹心得体会
2016/01/23 职场文书
普希金的诗歌赏析(3首)
2019/08/20 职场文书
十二月早安励志心语大全
2019/12/03 职场文书
Go使用协程交替打印字符
2021/04/29 Golang
Java获取字符串编码格式实现思路
2022/09/23 Java/Android