js 图片缩放(按比例)控制代码


Posted in Javascript onMay 27, 2009

缩放代码:

缩放代码: 
<script type="text/javascript"> 
//图片按比例缩放 
var flag = false; 
function DrawImage(ImgD, iwidth, iheight) { 
//参数(图片,允许的宽度,允许的高度) 
var image = new Image(); 
image.src = ImgD.src; 
if (image.width > 0 && image.height > 0) { 
flag = true; 
if (image.width / image.height >= iwidth / iheight) { 
if (image.width > iwidth) { 
ImgD.width = iwidth; 
ImgD.height = (image.height * iwidth) / image.width; 
} else { 
ImgD.width = image.width; 
ImgD.height = image.height; 
} 
ImgD.alt = image.width + "×" + image.height; 
} 
else { 
if (image.height > iheight) { 
ImgD.height = iheight; 
ImgD.width = (image.width * iheight) / image.height; 
} else { 
ImgD.width = image.width; 
ImgD.height = image.height; 
} 
ImgD.alt = image.width + "×" + image.height; 
} 
} 
} 
</script> 
页面代码: 
<img onload="javascript:DrawImage(this,89,63)" src="https://3water.com/images/logo.gif" width="89" height="63" border="0" /> 
觉得不错的发个言!

页面代码:
1. <img onload="javascript:DrawImage(this,89,63)" src="http://www.baidu.com/img/baidu_logo.gif" width="89" height="63" border="0" />
觉得不错的发个言!
Javascript 相关文章推荐
(function($){...})(jQuery)的意思
Jul 22 Javascript
JavaScript实现三阶幻方算法谜题解答
Dec 29 Javascript
jquery实现增加删除行的方法
Feb 03 Javascript
详解AngularJS Filter(过滤器)用法
Dec 28 Javascript
JavaScript编写页面半透明遮罩效果的简单示例
May 09 Javascript
Bootstrap carousel轮转图的使用实例详解
May 17 Javascript
JS实现图片剪裁并预览效果
Aug 12 Javascript
Vue表单实例代码
Sep 05 Javascript
JS实现探测网站链接的方法【测试可用】
Nov 08 Javascript
JS常用加密编码与算法实例总结
Dec 22 Javascript
微信小程序 共用变量值的实现
Jul 12 Javascript
vue引入微信sdk 实现分享朋友圈获取地理位置功能
Jul 04 Javascript
图片上传即时显示缩略图的js代码
May 27 #Javascript
JavaScript 闭包深入理解(closure)
May 27 #Javascript
jQuery 剧场版 你必须知道的javascript
May 27 #Javascript
javascript 日期时间函数(经典+完善+实用)
May 27 #Javascript
jquery cookie插件代码类
May 26 #Javascript
判断脚本加载是否完成的方法
May 26 #Javascript
javascript 复杂的嵌套环境中输出单引号和双引号
May 26 #Javascript
You might like
PHP4中实现动态代理
2006/10/09 PHP
用PHP和ACCESS写聊天室(五)
2006/10/09 PHP
php 目录与文件处理-郑阿奇(续)
2011/07/04 PHP
Yii1.1中通过Sql查询进行的分页操作方法
2017/03/16 PHP
js图片轮播手动切换效果
2015/11/10 Javascript
JavaScript使ifram跨域相互访问及与PHP通信的实例
2016/03/03 Javascript
Node.js读写文件之批量替换图片的实现方法
2016/09/07 Javascript
vue中渐进过渡效果实现
2016/10/27 Javascript
探讨跨域请求资源的几种方式(总结)
2016/12/02 Javascript
js中数组插入、删除元素操作的方法
2017/02/15 Javascript
微信小程序实现滑动删除效果
2017/05/19 Javascript
vue.js select下拉框绑定和取值方法
2018/03/03 Javascript
[原创]jquery判断元素内容是否为空的方法
2018/05/04 jQuery
jQuery动态移除与增加onclick属性的方法详解
2018/06/07 jQuery
详解KOA2如何手写中间件(装饰器模式)
2018/10/11 Javascript
PostgreSQL Node.js实现函数计算方法示例
2019/02/12 Javascript
angular 服务随记小结
2019/05/06 Javascript
基于node+vue实现简单的WebSocket聊天功能
2020/02/01 Javascript
解决React在安装antd之后出现的Can't resolve './locale'问题(推荐)
2020/05/03 Javascript
[01:02:06]LGD vs Mineski Supermajor 胜者组 BO3 第二场 6.5
2018/06/06 DOTA
Python获取当前时间的方法
2014/01/14 Python
python函数修饰符@的使用方法解析
2019/09/02 Python
python实现梯度法 python最速下降法
2020/03/24 Python
详解win10下pytorch-gpu安装以及CUDA详细安装过程
2021/01/28 Python
俄罗斯品牌服装和鞋子在线商店:BRIONITY
2020/03/26 全球购物
在网络中有两台主机A和B,并通过路由器和其他交换设备连接起来,已经确认物理连接正确无误,怎么来测试这两台机器是否连通?如果不通,怎么来判断故障点?怎么排
2014/01/13 面试题
社会实践评语
2014/04/28 职场文书
大学活动总结格式
2014/04/29 职场文书
邓小平理论心得体会
2014/09/09 职场文书
部队个人年终总结
2015/03/02 职场文书
2015年党日活动总结范文
2015/03/25 职场文书
2015年民主评议党员工作总结
2015/05/19 职场文书
2015上半年个人工作总结
2015/07/27 职场文书
Python Flask搭建yolov3目标检测系统详解流程
2021/11/07 Python
python前后端自定义分页器
2022/04/13 Python
CSS 实现磨砂玻璃(毛玻璃)效果样式
2023/05/21 HTML / CSS