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.Jcrop的头像编辑器
Mar 01 Javascript
xheditor与validate插件冲突的解决方案
Apr 15 Javascript
jQuery实现类似滑动门切换效果的层切换
Sep 23 Javascript
jQuery设置和获取HTML、文本和值示例
Jul 08 Javascript
jQuery实现网站添加高亮突出显示效果的方法
Jun 26 Javascript
jquery SweetAlert插件实现响应式提示框
Aug 18 Javascript
JavaScript多并发问题如何处理
Oct 28 Javascript
jQuery Validate表单验证插件 添加class属性形式的校验
Jan 18 Javascript
Js获取图片原始宽高的实现代码
May 17 Javascript
使用vue-cli导入Element UI组件的方法
May 16 Javascript
vue集成kindeditor富文本的实现示例代码
Jun 07 Javascript
JavaScript代码实现微博批量取消关注功能
Feb 05 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之COOKIE支持详解
2010/09/20 PHP
php实现快速排序法函数代码
2012/08/27 PHP
关于初学PHP时的知识积累总结
2013/06/07 PHP
php自动获取关键字的方法
2015/01/06 PHP
PHP面向对象自动加载机制原理与用法分析
2016/10/14 PHP
phpstudy默认不支持64位php的解决方法
2017/02/20 PHP
PHP中ltrim()函数的用法与实例讲解
2019/03/28 PHP
js创建对象的区别示例介绍
2014/07/24 Javascript
JavaScript之数组(Array)详解
2015/04/01 Javascript
JavaScript实现给按钮加上双重动作的方法
2015/08/14 Javascript
JavaScript对象学习小结
2015/09/02 Javascript
jQuery插件支持同一页面被多次调用
2016/02/14 Javascript
JavaScript基于原型链的继承
2016/06/22 Javascript
input 禁止输入特殊字符的四种实现方式
2016/08/24 Javascript
ES6学习教程之块级作用域详解
2017/10/09 Javascript
vue组件实践之可搜索下拉框功能
2018/11/25 Javascript
Vue自定义属性实例分析
2019/02/23 Javascript
微信小程序登录时如何获取input框中的内容
2019/12/04 Javascript
微信小程序实现可长按移动控件
2020/11/01 Javascript
Flexible.js可伸缩布局实现方法详解
2020/11/13 Javascript
编写Python的web框架中的Model的教程
2015/04/29 Python
Python中用max()方法求最大值的介绍
2015/05/15 Python
python中的插值 scipy-interp的实现代码
2018/07/23 Python
Python队列、进程间通信、线程案例
2019/10/25 Python
python实现ftp文件传输系统(案例分析)
2020/03/20 Python
python线程池如何使用
2020/05/28 Python
澳大利亚拥有最好的家具和家居用品在线目的地:Nestz
2019/02/23 全球购物
新员工欢迎词
2014/01/12 职场文书
空气环保标语
2014/06/12 职场文书
营销学习心得体会
2014/09/12 职场文书
小班上学期个人总结
2015/02/12 职场文书
员工辞退通知书
2015/04/17 职场文书
领导干部失职检讨书
2015/05/05 职场文书
2015年高三年级组工作总结
2015/07/21 职场文书
校园之声广播稿
2015/08/18 职场文书
详解pytorch创建tensor函数
2022/03/22 Python