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 相关文章推荐
动态创建的表格单元格中的事件实现代码
Dec 30 Javascript
Js 弹出框口并返回值的两种常用方法
Dec 30 Javascript
Javascript小技巧之生成html元素
May 15 Javascript
Javascript复制实例详解
Jan 28 Javascript
JavaScript兼容浏览器FF/IE技巧
Aug 14 Javascript
HTML5 js实现拖拉上传文件功能
Nov 20 Javascript
BootStrap实现带关闭按钮功能
Feb 15 Javascript
Vue2.0实现调用摄像头进行拍照功能 exif.js实现图片上传功能
Apr 28 Javascript
使用vue点击li,获取当前点击li父辈元素的属性值方法
Sep 12 Javascript
JavaScript ES6箭头函数使用指南
Dec 30 Javascript
详解Vue2 添加对scss的支持
Jan 02 Javascript
Node.js API详解之 console模块用法详解
May 12 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
不用数据库的多用户文件自由上传投票系统(2)
2006/10/09 PHP
phpmyadmin的#1251问题
2006/11/25 PHP
PHP的反射类ReflectionClass、ReflectionMethod使用实例
2014/08/05 PHP
PHP使用redis实现统计缓存mysql压力的方法
2015/11/14 PHP
Smarty变量用法详解
2016/05/11 PHP
PHP小程序支付功能完整版【基于thinkPHP】
2019/03/26 PHP
thinkPHP框架通过Redis实现增删改查操作的方法详解
2019/05/13 PHP
ASP.NET MVC中EasyUI的datagrid跨域调用实现代码
2012/03/14 Javascript
输入框过滤非数字的js代码
2014/09/18 Javascript
js实现select选择框效果及美化
2016/08/19 Javascript
利用JS实现简单的日期选择插件
2017/01/23 Javascript
Extjs表单输入框异步校验的插件实现方法
2017/03/20 Javascript
浅析Angular2子模块以及异步加载
2017/04/24 Javascript
jQuery动画_动力节点节点Java学院整理
2017/07/04 jQuery
12条写出高质量JS代码的方法
2018/01/07 Javascript
vue使用$emit时,父组件无法监听到子组件的事件实例
2018/02/26 Javascript
使用Angular CLI进行单元测试和E2E测试的方法
2018/03/24 Javascript
微信小程序实现同时上传多张图片
2020/02/03 Javascript
跟老齐学Python之集成开发环境(IDE)
2014/09/12 Python
详解python Todo清单实战
2018/11/01 Python
django 外键model的互相读取方法
2018/12/15 Python
在django admin中添加自定义视图的例子
2019/07/26 Python
Python cookie的保存与读取、SSL讲解
2020/02/17 Python
使用CSS3来匹配横屏竖屏的简单方法
2015/08/04 HTML / CSS
肯尼亚网上商城:Kilimall
2016/08/20 全球购物
Linux面试题LINUX系统类
2015/11/25 面试题
《有趣的发现》教学反思
2014/04/15 职场文书
机械设计制造及其自动化专业求职信
2014/06/17 职场文书
员工年终自我评价
2014/09/14 职场文书
群众路线对照检查材料
2014/09/22 职场文书
房屋租赁合同解除协议书
2014/10/11 职场文书
学生会个人总结范文
2015/02/15 职场文书
小英雄雨来观后感
2015/06/09 职场文书
毕业赠语大全
2015/06/23 职场文书
新年寄语2016
2015/08/17 职场文书
2016年社区国庆节活动总结
2016/04/01 职场文书