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 相关文章推荐
为你的网站增加亮点的9款jQuery插件推荐
May 03 Javascript
jQuery(非HTML5)可编辑表格实现代码
Dec 11 Javascript
简单时间提示DEMO从0开始一直进行计时
Nov 19 Javascript
Jquery实现$.fn.extend和$.extend函数
Apr 14 Javascript
很棒的Bootstrap选项卡切换效果
Jul 01 Javascript
基于Vue 服务端Cookies删除的问题
Sep 21 Javascript
解决LayUI数据表格复选框不居中显示的问题
Sep 25 Javascript
微信小程序wx.request的简单封装
Nov 13 Javascript
JavaScript实现多个物体同时运动
Mar 12 Javascript
VSCode搭建React Native环境
May 07 Javascript
uni-app微信小程序登录授权的实现
May 22 Javascript
vue如何搭建多页面多系统应用
Jun 17 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 类型转换函数intval
2009/06/20 PHP
PHP框架Swoole定时器Timer特性分析
2014/08/19 PHP
php中数字、字符与对象判断函数用法实例
2014/11/26 PHP
php-redis中的sort排序函数总结
2015/07/08 PHP
php版微信小店API二次开发及使用示例
2016/11/12 PHP
基于jquery的获取mouse坐标插件的实现代码
2010/04/01 Javascript
js实现的跟随鼠标移动的时钟效果(中英文日期显示)
2011/01/17 Javascript
js调用activeX获取u盘序列号的代码
2011/11/21 Javascript
jquery 页面滚动到指定DIV实现代码
2013/09/25 Javascript
jQuery遍历Table应用示例
2014/04/09 Javascript
javascript等号运算符使用详解
2015/04/16 Javascript
js中使用使用原型(prototype)定义方法的好处详解
2016/07/04 Javascript
jquery实现(textarea)placeholder自动换行
2016/12/22 Javascript
JavaScript中各数制转换全面总结
2017/08/21 Javascript
vue引入js数字小键盘的实现代码
2018/05/14 Javascript
微信小程序实现的自定义分享功能示例
2019/02/12 Javascript
vue 导航内容设置选中状态样式的例子
2019/11/01 Javascript
微信小程序实现单个卡片左滑显示按钮并防止上下滑动干扰功能
2019/12/06 Javascript
浅谈webpack构建工具配置和常用插件总结
2020/05/11 Javascript
[44:30]完美世界DOTA2联赛PWL S2 GXR vs Magma 第一场 11.25
2020/11/26 DOTA
Python 执行字符串表达式函数(eval exec execfile)
2014/08/11 Python
Python遍历目录中的所有文件的方法
2016/07/08 Python
Python实现Mysql数据库连接池实例详解
2017/04/11 Python
python利用正则表达式搜索单词示例代码
2017/09/24 Python
python通过opencv实现批量剪切图片
2017/11/13 Python
python中下标和切片的使用方法解析
2019/08/27 Python
Python错误的处理方法
2020/06/23 Python
Python模拟键盘输入自动登录TGP
2020/11/27 Python
详解HTML5 data-* 自定义属性
2018/01/24 HTML / CSS
canvas进阶之如何画出平滑的曲线
2018/10/15 HTML / CSS
Brora官网:英国领先的羊绒服装品牌
2019/08/28 全球购物
超市5.1促销活动
2014/01/15 职场文书
关于读书的演讲稿
2014/05/07 职场文书
研修心得体会
2014/09/04 职场文书
万能检讨书开头与结尾怎么写
2015/02/17 职场文书
Python面试不修改数组找出重复的数字
2022/05/20 Python