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实现带关闭功能的阿里妈妈网站顶部滑出banner工具条代码
Sep 17 Javascript
JS数组排序技巧汇总(冒泡、sort、快速、希尔等排序)
Nov 24 Javascript
扩展jquery easyui tree的搜索树节点方法(推荐)
Oct 28 Javascript
jQuery实现的分页功能示例
Jan 22 Javascript
JS数组操作之增删改查的简单实现
Aug 21 Javascript
使用JS组件实现带ToolTip验证框的实例代码
Aug 23 Javascript
vue组件生命周期详解
Nov 07 Javascript
vue toggle做一个点击切换class(实例讲解)
Mar 13 Javascript
Windows上node.js的多版本管理工具用法实例分析
Nov 06 Javascript
vue自定义正在加载动画的例子
Nov 14 Javascript
基于JS实现快速读取TXT文件
Aug 25 Javascript
Openlayers3实现车辆轨迹回放功能
Sep 29 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
php中将一段数据存到一个txt文件中并显示其内容
2014/08/15 PHP
在html文件中也可以执行php语句的方法
2015/04/09 PHP
php商品对比功能代码分享
2015/09/24 PHP
php中get_magic_quotes_gpc()函数说明
2017/02/06 PHP
thinkphp5 URL和路由的功能详解与实例
2017/12/26 PHP
JavaScript 版本自动生成文章摘要
2008/07/23 Javascript
利用CSS、JavaScript及Ajax实现高效的图片预加载
2013/10/16 Javascript
在Firefox下js select标签点击无法弹出
2014/03/06 Javascript
jQuery css() 方法动态修改CSS属性
2016/09/25 Javascript
jQuery拖拽通过八个点改变div大小
2020/11/29 Javascript
nodejs async异步常用函数总结(推荐)
2017/11/17 NodeJs
微信小程序实现天气预报功能
2018/07/18 Javascript
关于layui 实现点击按钮添加一行(方法渲染创建的table)
2019/09/29 Javascript
Vue自定义组件的四种方式示例详解
2020/02/28 Javascript
使用eslint和githooks统一前端风格的技巧
2020/07/29 Javascript
python模拟Django框架实例
2016/05/17 Python
Python使用Scrapy爬虫框架全站爬取图片并保存本地的实现代码
2018/03/04 Python
对Python中的@classmethod用法详解
2018/04/21 Python
python 字典中文key处理,读取,比较方法
2018/07/06 Python
Python的matplotlib绘图如何修改背景颜色的实现
2019/07/16 Python
Python+OpenCV实现实时眼动追踪的示例代码
2019/11/11 Python
基于python检查SSL证书到期情况代码实例
2020/04/04 Python
django 数据库返回queryset实现封装为字典
2020/05/19 Python
用python读取xlsx文件
2020/12/17 Python
详解Canvas 实现炫丽的粒子运动效果(粒子生成文字)
2018/02/01 HTML / CSS
请说出这段代码执行后a和b的值分别是多少
2015/03/28 面试题
感恩母亲节活动方案
2014/03/04 职场文书
五水共治一句话承诺
2014/05/30 职场文书
国际商务英语专业求职信
2014/07/08 职场文书
大学生见习报告总结
2014/11/04 职场文书
鲁滨孙漂流记读书笔记
2015/06/30 职场文书
实验室安全管理制度
2015/08/05 职场文书
新手开公司创业注意事项有哪些?
2019/07/29 职场文书
MySQL学习总结-基础架构概述
2021/04/05 MySQL
Python字符串常规操作小结
2022/04/03 Python
ubuntu如何搭建vsftpd服务器
2022/12/24 Servers