JS控制图片等比例缩放的示例代码


Posted in Javascript onDecember 24, 2013
<SCRIPT language="JavaScript">
function DrawImage(ImgD,FitWidth,FitHeight){   
    var image=new Image();   
    image.src=ImgD.src;   
    if(image.width>0 && image.height>0){   
        if(image.width/image.height>= FitWidth/FitHeight){   
            if(image.width>FitWidth){   
                ImgD.width=FitWidth;   
                ImgD.height=(image.height*FitWidth)/image.width;   
            }   
            else{   
                ImgD.width=image.width;   
                ImgD.height=image.height;   
            }   
        }   
        else{   
            if(image.height>FitHeight){   
                ImgD.height=FitHeight;   
                ImgD.width=(image.width*FitHeight)/image.height;   
            }   
            else{   
                ImgD.width=image.width;   
                ImgD.height=image.height;   
            }   
        }   
    }   
}   
</script>

调用方法:
<a href="admin/<? echo $rscase['path']?>" target="_blank"><img src="admin/<? echo $rscase['path']?>" alt="点击放大图片" width="180" height="180" onload='javascript:DrawImage(this,180,);' hspace="3" vspace="3" border="0" /></a>
Javascript 相关文章推荐
ie7+背景透明文字不透明超级简单的实现方法
Jan 17 Javascript
node.js学习总结之调式代码的方法
Jun 25 Javascript
JavaScript实现获取dom中class的方法
Feb 09 Javascript
js利用appendChild对标签进行排序的实现方法
Oct 16 Javascript
jsp 网站引入外部css或者js失效问题解决
Oct 31 Javascript
树结构之JavaScript
Jan 24 Javascript
JS获取url参数,JS发送json格式的POST请求方法
Mar 29 Javascript
详解react、redux、react-redux之间的关系
Apr 11 Javascript
详解vuex 渐进式教程实例代码
Nov 27 Javascript
微信小程序点餐系统开发常见问题汇总
Aug 06 Javascript
layer提示框添加多个按钮选择的实例
Sep 12 Javascript
解决Vue大括号字符换行踩的坑
Nov 09 Javascript
JS 屏蔽按键效果与改变按键效果的示例代码
Dec 24 #Javascript
js清除input中type等于file的值域(示例代码)
Dec 24 #Javascript
js 获取、清空input type=&quot;file&quot;的值(示例代码)
Dec 24 #Javascript
jQuery点击自身以外地方关闭弹出层的简单实例
Dec 24 #Javascript
JS刷新当前页面的几种方法总结
Dec 24 #Javascript
js中indexof的用法详细解析
Dec 24 #Javascript
js 点击页面其他地方关闭弹出层(示例代码)
Dec 24 #Javascript
You might like
基于magic_quotes_gpc与magic_quotes_runtime的区别与使用介绍
2013/04/22 PHP
PHP Session 变量的使用方法详解与实例代码
2013/09/11 PHP
php通过获取头信息判断图片类型的方法
2015/06/26 PHP
利用JavaScript实现新闻滚动效果(实例代码)
2013/11/27 Javascript
浅谈Javascript 执行顺序
2013/12/18 Javascript
javascript通过className来获取元素的简单示例代码
2014/01/10 Javascript
node.js中的fs.realpath方法使用说明
2014/12/16 Javascript
简述Matlab中size()函数的用法
2016/03/20 Javascript
js实现带农历和八字等信息的日历特效
2016/05/16 Javascript
javascript实现随机生成DIV背景色
2016/06/20 Javascript
很棒的Bootstrap选项卡切换效果
2016/07/01 Javascript
express文件上传中间件Multer详解
2016/10/24 Javascript
全面解析vue中的数据双向绑定
2017/05/10 Javascript
layer弹出层全屏及关闭方法
2018/08/17 Javascript
vue-cli 默认路由再子路由选中下的选中状态问题及解决代码
2018/09/06 Javascript
Javascript迭代、递推、穷举、递归常用算法实例讲解
2019/02/01 Javascript
解决layui追加或者动态修改的表单元素“没效果”的问题
2019/09/18 Javascript
js中关于Blob对象的介绍与使用
2019/11/29 Javascript
[03:00]2014DOTA2国际邀请赛 Titan淘汰潸然泪下Ohaiyo专访
2014/07/15 DOTA
Python实现求最大公约数及判断素数的方法
2015/05/26 Python
python3 爬取图片的实例代码
2018/11/06 Python
pycharm中显示CSS提示的知识点总结
2019/07/29 Python
python 怎样将dataframe中的字符串日期转化为日期的方法
2019/09/26 Python
Pytorch 之修改Tensor部分值方式
2019/12/27 Python
python爬虫添加请求头代码实例
2019/12/28 Python
Pytorch to(device)用法
2020/01/08 Python
python sklearn包——混淆矩阵、分类报告等自动生成方式
2020/02/28 Python
萌新的HTML5 入门指南
2020/11/06 HTML / CSS
全球性的在线鞋类品牌:Public Desire
2019/04/03 全球购物
Ticketmaster意大利:音乐会、节日、艺术和剧院的官方门票
2019/12/23 全球购物
英国最大的天然和有机产品在线零售商之一:Big Green Smile
2020/05/06 全球购物
JPA面试常见问题
2016/11/14 面试题
共产党员岗位承诺书
2014/05/29 职场文书
银行保安拾金不昧表扬稿
2015/05/05 职场文书
七年级话题作文之执着
2019/11/19 职场文书
自动在Windows中运行Python脚本并定时触发功能实现
2021/09/04 Python