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 相关文章推荐
IE8对JS通过属性和数组遍历解析不一样的地方探讨
May 06 Javascript
解析页面加载与js函数的执行 onload or ready
Dec 12 Javascript
jQuery三级下拉列表导航菜单代码分享
Apr 15 Javascript
jQuery中trigger()与bind()用法分析
Dec 18 Javascript
常用Javascript函数与原型功能收藏(必看篇)
Oct 09 Javascript
jQuery基于排序功能实现上移、下移的方法
Nov 26 Javascript
基于vue.js实现图片轮播效果
Dec 01 Javascript
jQuery实现鼠标点击处心形漂浮的炫酷效果示例
Apr 12 jQuery
详解vue指令与$nextTick 操作DOM的不同之处
Aug 02 Javascript
vue + any-touch实现一个iscroll 实现拖拽和滑动动画效果
Apr 08 Javascript
js验证身份证号码记录的方法
Apr 26 Javascript
vue单应用在ios系统中实现微信分享功能操作
Sep 07 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
php递归创建和删除文件夹的代码小结
2012/04/13 PHP
使用php计算排列组合的方法
2013/11/13 PHP
PHP简单读取PDF页数的实现方法
2016/07/21 PHP
TP5框架实现上传多张图片的方法分析
2020/03/29 PHP
javascript动画效果类封装代码
2007/08/28 Javascript
javascript 打印页面代码
2009/03/24 Javascript
javascript 数组排序函数
2009/08/20 Javascript
javascript闭包的理解和实例
2010/08/12 Javascript
jQuery通过扩展实现抖动效果的方法
2015/03/11 Javascript
微信JSSDK上传图片
2015/08/23 Javascript
令按钮悬浮在(手机)页面底部的实现方法
2017/05/02 Javascript
详解Angular路由 ng-route和ui-router的区别
2017/05/22 Javascript
Vue单页式应用(Hash模式下)实现微信分享的实例
2017/07/21 Javascript
vue-router实现组件间的跳转(参数传递)
2017/11/07 Javascript
vue+web端仿微信网页版聊天室功能
2019/04/30 Javascript
JavaScript+HTML5 canvas实现放大镜效果完整示例
2019/05/15 Javascript
在Vue环境下利用worker运行interval计时器的步骤
2019/08/01 Javascript
JavaScript 截取字符串代码实例
2019/09/05 Javascript
javascript实现智能手环时间显示
2020/09/18 Javascript
js正则表达式简单校验方法
2021/01/03 Javascript
使用python绘制人人网好友关系图示例
2014/04/01 Python
python通过socket实现多个连接并实现ssh功能详解
2017/11/08 Python
python 实现得到当前时间偏移day天后的日期方法
2018/12/31 Python
Python图像处理库PIL中图像格式转换的实现
2020/02/26 Python
自定义实现 PyQt5 下拉复选框 ComboCheckBox的完整代码
2020/03/30 Python
python自动生成证件号的方法示例
2021/01/14 Python
小程序canvas中文字设置居中锚点
2019/04/16 HTML / CSS
Pandora西班牙官方商店:PandoraShop.es
2020/10/05 全球购物
优秀大学生职业生涯规划书
2014/02/27 职场文书
2014年端午节演讲稿范文
2014/05/23 职场文书
服务明星事迹材料
2014/12/29 职场文书
蓬莱阁导游词
2015/02/04 职场文书
员工离职通知函
2015/04/25 职场文书
淮海战役观后感
2015/06/11 职场文书
同意报考公务员证明
2015/06/17 职场文书
分享node.js实现简单登录注册的具体代码
2022/04/26 NodeJs