JS控制图片显示的大小(图片等比例缩放)

简介: New Document

<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script language="JavaScript">
<!--
var flag=false;
function DrawImage(ImgD){
 var image=new Image();
 image.src=ImgD.src;
 if(image.width>0 && image.height>0){
  flag=true;
  if(image.width/image.height>= 164/112){
   if(image.width>164){
    ImgD.width=164;
    ImgD.height=(image.height*164)/image.width;
   }else{
    ImgD.width=image.width;
    ImgD.height=image.height;
   }
   ImgD.alt=image.width+"x"+image.height;
  }
  else{
   if(image.height>112){
    ImgD.height=112;
    ImgD.width=(image.width*112)/image.height;
   }else{
    ImgD.width=image.width;
    ImgD.height=image.height;
   }
   ImgD.alt=image.width+"x"+image.height;
  }
 }
}
//-->
</script>
</HEAD>

<BODY>

<a href="./img.jpg" target="_blank"><img src="./img.jpg" border="0" width="164" height="112" onload="javascript:DrawImage(this);"></a>
</BODY>
</HTML>

目录
相关文章
|
2月前
|
JavaScript 前端开发 安全
使用 Node.js 插件给指定目录下的所有图片添加上文字水印
使用 Node.js 插件给指定目录下的所有图片添加上文字水印
58 0
|
3月前
|
移动开发 JavaScript 定位技术
分享118个JS图片代码,总有一款适合您
分享118个JS图片代码,总有一款适合您
22 0
|
1月前
|
JavaScript 前端开发 API
js截取图片地址后面的参数和在路径中截取文件名或后缀名
在处理网页上的图片资源或者其他类型的文件资源时,你可能会遇到需要使用这些技巧的情况。以下是一些具体的使用场景:
19 0
|
1月前
|
JavaScript
js判断图片是否加载完成
js判断图片是否加载完成
24 0
|
1月前
|
Web App开发 前端开发 iOS开发
编程笔记 html5&css&js 008 HTML图片
编程笔记 html5&css&js 008 HTML图片
|
2月前
|
开发框架 JavaScript 小程序
uniapp、vue、小程序、js图片转base64 示例代码
uniapp、vue、小程序、js图片转base64 示例代码
|
3月前
|
JavaScript 前端开发 安全
分享117个JS图片代码,总有一款适合您
分享117个JS图片代码,总有一款适合您
14 0
|
2月前
|
JavaScript
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
27 0
|
2月前
|
消息中间件 Web App开发 JavaScript
Node.js【简介、安装、运行 Node.js 脚本、事件循环、ES6 作业队列、Buffer(缓冲区)、Stream(流)】(一)-全面详解(学习总结---从入门到深化)
Node.js【简介、安装、运行 Node.js 脚本、事件循环、ES6 作业队列、Buffer(缓冲区)、Stream(流)】(一)-全面详解(学习总结---从入门到深化)
77 0
|
3天前
|
JavaScript 前端开发 测试技术
学习JavaScript
【4月更文挑战第23天】学习JavaScript
11 1