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 相关文章推荐
JS的反射问题
Apr 07 Javascript
javascript题目,重写函数让其无限相加
Feb 15 Javascript
Jquery Easyui对话框组件Dialog使用详解(14)
Dec 19 Javascript
JavaScript函数表达式详解及实例
May 05 Javascript
React组件生命周期详解
Jul 03 Javascript
react.js使用webpack搭配环境的入门教程
Aug 14 Javascript
详解JS中的柯里化(currying)
Aug 17 Javascript
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
Jan 18 jQuery
解决vue.js this.$router.push无效的问题
Sep 03 Javascript
Vue监听数据渲染DOM完以后执行某个函数详解
Sep 11 Javascript
layui动态渲染生成左侧3级菜单的方法(根据后台返回数据)
Sep 23 Javascript
Vue通过for循环随机生成不同的颜色或随机数的实例
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
杏林同学录(四)
2006/10/09 PHP
php 301转向实现代码
2008/09/18 PHP
PHP 设计模式之观察者模式介绍
2012/02/22 PHP
PHP获取网址的顶级域名函数代码
2012/09/24 PHP
ThinkPHP中的关联模型注意点
2014/06/16 PHP
php查看当前Session的ID实例
2015/03/16 PHP
php微信公众号开发之翻页查询
2018/10/20 PHP
强制设为首页代码
2006/06/19 Javascript
Prototype Date对象 学习
2009/07/12 Javascript
jQuery 无刷新分页实例代码
2013/11/12 Javascript
js隐式全局变量造成的bug示例代码
2014/04/22 Javascript
nodejs实现黑名单中间件设计
2014/06/17 NodeJs
js实现图片从左往右渐变切换效果的方法
2015/02/06 Javascript
不得不分享的JavaScript常用方法函数集(上)
2015/12/23 Javascript
JavaScript实现弹出DIV层同时页面背景渐变成半透明效果
2016/03/25 Javascript
BootStrap表单宽度设置方法
2017/03/10 Javascript
JS监控关闭浏览器操作的实例详解
2017/09/12 Javascript
完美解决iview 的select下拉框选项错位的问题
2018/03/02 Javascript
微信jssdk逻辑在vue中的运用详解
2018/11/14 Javascript
微信小程序当前时间时段选择器插件使用方法详解
2018/12/28 Javascript
使用mixins实现elementUI表单全局验证的解决方法
2019/04/02 Javascript
详解服务端预渲染之Nuxt(介绍篇)
2019/04/07 Javascript
Python中random模块用法实例分析
2015/05/19 Python
Django中使用celery完成异步任务的示例代码
2018/01/23 Python
python基于物品协同过滤算法实现代码
2018/05/31 Python
浅述python中深浅拷贝原理
2018/09/18 Python
python 读取竖线分隔符的文本方法
2018/12/20 Python
Django 自动生成api接口文档教程
2019/11/19 Python
Python程序慢的重要原因
2020/09/04 Python
Django filter动态过滤与排序实现过程解析
2020/11/26 Python
您熟悉ORM(Object-Relation Mapping)吗?请谈谈您所理解的ORM
2016/02/08 面试题
2015年幼儿园个人工作总结
2015/04/25 职场文书
巾帼建功标兵先进事迹材料
2016/02/29 职场文书
python实现腾讯滑块验证码识别
2021/04/27 Python
python用tkinter开发的扫雷游戏
2021/06/01 Python
使用pycharm运行flask应用程序的详细教程
2021/06/07 Python