图片自动缩小的js代码,用以防止图片撑破页面


Posted in Javascript onMarch 12, 2007

JS代码(随便放哪里):
<script language="JavaScript"> 
<!-- 
var flag=false; 
function DrawImage(ImgD){ 
var image=new Image(); 
image.src=https://3water.com/htmldata/2006-01-08/ImgD.src; 
if(image.width>0 && image.height>0){ 
  flag=true; 
  if(image.width/image.height>= 180/110){ 
   if(image.width>180){
    ImgD.width=180; 
    ImgD.height=(image.height*110)/image.width; 
   }else{ 
    ImgD.width=image.width;
    ImgD.height=image.height; 
   } 
   /*ImgD.alt="bigpic"  */
  } 
  else{ 
   if(image.height>110){
    ImgD.height=110; 
    ImgD.width=(image.width*110)/image.height; 
   }else{ 
    ImgD.width=image.width;
    ImgD.height=image.height; 
   } 
    /*ImgD.alt="bigpic"  */ 
  } 
}
}
//--> 
</script>
图片使用的地方:
<img src="https://3water.com/htmldata/2006-01-08/图片" border=0 width="180" height="110" onload="javascriptrawImage(this);">
width="180" height="110"  注意这里最好限定,如果不限定加载图时会成原大,然后再缩小,这个过程如果图大了很难看的.这里是宽度和高度,在前面的JS里改,这里也作相应的改.
图不会变形,只会按比列缩,放心

Javascript 相关文章推荐
JavaScript 高级语法介绍
Jun 15 Javascript
jquery checkbox实现单选小例
Nov 27 Javascript
JavaScript框架(iframe)操作总结
Apr 16 Javascript
JavaScript中的比较操作符&gt;、=、
Dec 31 Javascript
jquery实现点击页面计算点击次数
Jan 23 Javascript
jQuery+CSS3实现树叶飘落特效
Feb 01 Javascript
javascript格式化json显示实例分析
Apr 21 Javascript
jQuery实现提示密码强度的代码
Jul 15 Javascript
Javascript实现的SHA-256加密算法完整实例
Feb 02 Javascript
iscroll实现下拉刷新功能
Jul 18 Javascript
基于JS实现带动画效果的流程进度条
Jun 01 Javascript
el-input 标签中密码的显示和隐藏功能的实例代码
Jul 19 Javascript
[原创]js与自动伸缩图片 自动缩小图片的多浏览器兼容的方法总结
Mar 12 #Javascript
网页中实现浏览器的最大,最小化和关闭按钮
Mar 12 #Javascript
如何在Web页面上直接打开、编辑、创建Office文档
Mar 12 #Javascript
(function(){})()的用法与优点
Mar 11 #Javascript
可以文本显示的公告栏的js代码
Mar 11 #Javascript
简单三步,搞掂内存泄漏
Mar 10 #Javascript
如何简单地用YUI做JavaScript动画
Mar 10 #Javascript
You might like
php 中include()与require()的对比
2006/10/09 PHP
显示程序执行时间php函数代码
2013/08/29 PHP
IIS 7.5 asp Session超时时间设置方法
2017/04/17 PHP
php表单习惯用的正则表达式
2017/10/11 PHP
laravel 解决后端无法获取到前端Post过来的值问题
2019/10/22 PHP
详解phpstorm2020最新破解方法
2020/09/17 PHP
JS实现侧悬浮浮动实例代码
2013/11/29 Javascript
jquery 页面滚动到底部自动加载插件集合
2014/01/31 Javascript
页面加载完成后再执行JS的jquery写法以及区别说明
2014/02/22 Javascript
jQuery过滤选择器:not()方法使用介绍
2014/04/20 Javascript
node.js中Socket.IO的进阶使用技巧
2014/11/04 Javascript
一个php+js实时显示时间问题
2015/10/12 Javascript
全系IE支持Bootstrap的解决方法
2015/10/19 Javascript
图解js图片轮播效果
2015/12/20 Javascript
利用vscode编写vue的简单配置详解
2017/06/17 Javascript
vue.js全局API之nextTick全面解析
2017/07/07 Javascript
vue-router2.0 组件之间传参及获取动态参数的方法
2017/11/10 Javascript
React组件refs的使用详解
2018/02/09 Javascript
JavaScript常见鼠标事件与用法分析
2019/01/03 Javascript
送你43道JS面试题(收藏)
2019/06/17 Javascript
[02:22]2018DOTA2亚洲邀请赛VG赛前采访
2018/04/03 DOTA
Python判断操作系统类型代码分享
2014/11/22 Python
python实现计算倒数的方法
2015/07/11 Python
Python使用pip安装pySerial串口通讯模块
2018/04/20 Python
JD Sports瑞典:英国领先的运动时尚商店
2018/01/28 全球购物
Belstaff英国官方在线商店:Belstaff.co.uk
2021/02/09 全球购物
SQL注入攻击的种类有哪些
2013/12/30 面试题
Static Nested Class 和 Inner Class的不同
2013/11/28 面试题
班级聚会策划书
2014/01/16 职场文书
《回乡偶书》教学反思
2014/04/12 职场文书
迎新春趣味活动方案
2014/08/24 职场文书
爱的奉献演讲稿
2014/09/10 职场文书
学习十八大宣传标语
2014/10/09 职场文书
2015年档案管理员工作总结
2015/05/13 职场文书
好员工观后感
2015/06/17 职场文书
Python实现生活常识解答机器人
2021/06/28 Python