javascript简单实现等比例缩小图片的方法


Posted in Javascript onJuly 27, 2016

本文实例讲述了javascript简单实现等比例缩小图片的方法。分享给大家供大家参考,具体如下:

//等比例缩小图片
function changeImg(obj,width,height) {
  var img = new Image();
  img.src = document.getElementById(obj.id).src
  var ys_w = img.width;
  var ys_h = img.height;
  if(ys_w > width || ys_h > height)
  {
    var scale;
    var scale1 = ys_w / width;
    var scale2 = ys_h / height;
    //alert(scale1+","+scale2);
    if(scale1 > scale2)
    {
      scale = scale1;
    }
    else
    {
      scale = scale2;
    }
    document.getElementById(obj.id).style.width = ys_w / scale;
    document.getElementById(obj.id).style.height = ys_h / scale;
  }
}

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jQuery Select(单选) 模拟插件 V1.3.62 改进版
Jul 17 Javascript
避免回车键导致的页面无意义刷新的解决方法
Apr 12 Javascript
js 异步操作回调函数如何控制执行顺序
Dec 24 Javascript
Jquery对象和Dom对象的区别分析
Nov 20 Javascript
jQuery解析json数据实例分析
Nov 24 Javascript
JS填写银行卡号每隔4位数字加一个空格
Dec 19 Javascript
angular基于ng-alain定义自己的select组件示例
Feb 23 Javascript
node+koa2+mysql+bootstrap搭建一个前端论坛
May 06 Javascript
关于自定义Egg.js的请求级别日志详解
Dec 12 Javascript
JavaScript设计模式之责任链模式实例分析
Jan 16 Javascript
在vue中封装方法以及多处引用该方法详解
Aug 14 Javascript
vue用ant design中table表格,点击某行时触发的事件操作
Oct 28 Javascript
第一次接触神奇的Bootstrap网格系统
Jul 27 #Javascript
Js删除数组中某一项或几项的几种方法(推荐)
Jul 27 #Javascript
javascript获取网页各种高宽及位置的方法总结
Jul 27 #Javascript
第一次接触神奇的Bootstrap表单
Jul 27 #Javascript
AngularJS 表达式详细讲解及实例代码
Jul 26 #Javascript
基于jQuery实现页面搜索功能
Mar 26 #Javascript
JS中的数组方法笔记整理
Jul 26 #Javascript
You might like
如何去掉文章里的 html 语法
2006/10/09 PHP
php记录搜索引擎爬行记录的实现代码
2018/03/02 PHP
Fastest way to build an HTML string(拼装html字符串的最快方法)
2011/08/20 Javascript
js鼠标滑过弹出层的定位IE6bug解决办法
2012/12/26 Javascript
jquery获取URL中参数解决中文乱码问题的两种方法
2013/12/18 Javascript
JavaScript匿名函数用法分析
2015/02/13 Javascript
vue2.0使用Sortable.js实现的拖拽功能示例
2017/02/21 Javascript
COM组件中调用JavaScript函数详解及实例
2017/02/23 Javascript
vue-music关于Player播放器组件详解
2017/11/28 Javascript
JS基于for语句编写的九九乘法表示例
2018/01/04 Javascript
vue+axios+element ui 实现全局loading加载示例
2018/09/11 Javascript
JS判断用户用的哪个浏览器实例详解
2018/10/09 Javascript
原生js实现移动端Touch轮播图的方法步骤
2019/01/03 Javascript
微信小程序设置滚动条过程详解
2019/07/25 Javascript
微信小程序实现吸顶效果
2020/01/08 Javascript
js实现鼠标拖曳效果
2020/12/30 Javascript
[06:09]辉夜杯主赛事开幕式
2015/12/25 DOTA
python基础教程之udp端口扫描
2014/02/10 Python
CentOS中使用virtualenv搭建python3环境
2015/06/08 Python
Python实现线程池代码分享
2015/06/21 Python
Python基于回溯法子集树模板解决取物搭配问题实例
2017/09/02 Python
python将txt文件读取为字典的示例
2018/12/22 Python
Python设计模式之简单工厂模式实例详解
2019/01/22 Python
在pycharm中配置Anaconda以及pip源配置详解
2019/09/09 Python
Python面向对象之私有属性和私有方法应用案例分析
2019/12/31 Python
Python利用命名空间解析XML文档
2020/08/10 Python
canvas绘制文本内容自动换行的实现代码
2019/01/14 HTML / CSS
如何设置Java的运行环境
2013/04/05 面试题
药品促销活动方案
2014/02/14 职场文书
槐乡的孩子教学反思
2014/04/27 职场文书
教师国庆节演讲稿范文2014
2014/09/21 职场文书
小学教师学习党的群众路线教育实践活动心得体会
2014/10/31 职场文书
幼儿园小班个人总结
2015/02/12 职场文书
《学会看病》教学反思
2016/02/17 职场文书
springboot临时文件存储目录配置方式
2021/07/01 Java/Android
Python OpenCV超详细讲解读取图像视频和网络摄像头
2022/04/02 Python