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 相关文章推荐
任意位置显示html菜单
Feb 01 Javascript
asp.net网站开发中用jquery实现滚动浏览器滚动条加载数据(类似于腾讯微博)
Mar 14 Javascript
关于JS数组追加数组采用push.apply的问题
Jun 09 Javascript
jQuery中extend函数详解
Feb 13 Javascript
用headjs来管理和加载js 提高网站加载速度
Nov 29 Javascript
深入理解jquery中的each用法
Dec 14 Javascript
使用jQuery监听扫码枪输入并禁止手动输入的实现方法(推荐)
Mar 21 jQuery
vue组件初学_弹射小球(实例讲解)
Sep 06 Javascript
springmvc接收jquery提交的数组数据代码分享
Oct 28 jQuery
javascript对HTML字符转义与反转义
Dec 13 Javascript
使用Promise封装小程序wx.request的实现方法
Nov 13 Javascript
js闭包的9个使用场景
Dec 29 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
for循环连续求和、九九乘法表代码
2012/02/20 PHP
jQuery AnythingSlider滑动效果插件
2010/02/07 Javascript
node.js开发中使用Node Supervisor实现监测文件修改并自动重启应用
2014/11/04 Javascript
js实现文字跟随鼠标移动而移动的方法
2015/02/28 Javascript
基于jquery编写的放大镜插件
2016/03/23 Javascript
详解Bootstrap插件
2016/04/25 Javascript
详细总结Javascript中的焦点管理
2016/09/17 Javascript
js仿手机页面文件下拉刷新效果
2016/10/14 Javascript
JS三目运算(三元运算)方法详解
2017/03/01 Javascript
JS实现的抛物线运动效果示例
2018/01/30 Javascript
nodejs实现解析xml字符串为对象的方法示例
2018/03/14 NodeJs
JavaScript设计模式之装饰者模式实例详解
2019/01/17 Javascript
package.json配置文件构成详解
2019/08/27 Javascript
vue draggable resizable gorkys与v-chart使用与总结
2019/09/05 Javascript
js实现图片区域可点击大小随意改变(适用移动端)代码实例
2019/09/11 Javascript
[02:32]【DOTA2亚洲邀请赛】iceice,梦开始的地方
2017/03/13 DOTA
基于python的Tkinter实现一个简易计算器
2015/12/31 Python
Python利用BeautifulSoup解析Html的方法示例
2017/07/30 Python
Python正确重载运算符的方法示例详解
2017/08/27 Python
Python实现针对含中文字符串的截取功能示例
2017/09/22 Python
Python 3.x 判断 dict 是否包含某键值的实例讲解
2018/07/06 Python
opencv python 图像轮廓/检测轮廓/绘制轮廓的方法
2019/07/03 Python
centos+nginx+uwsgi+Django实现IP+port访问服务器
2019/11/15 Python
python 弧度与角度互转实例
2020/04/15 Python
一个非常简单好用的Python图形界面库(PysimpleGUI)
2020/12/28 Python
详解HTML5中的拖放事件(Drag 和 drop)
2016/11/14 HTML / CSS
鞋子女王塔玛拉·梅隆同名奢侈品牌:Tamara Mellon
2017/11/22 全球购物
Myprotein台湾官方网站:全球领先的运动营养品牌
2018/12/10 全球购物
如何将一个描述日期或日期/时间的字符串转换为一个Date对象
2015/10/13 面试题
函授毕业生自我鉴定范文
2014/03/25 职场文书
大跃进口号
2014/06/16 职场文书
离婚财产分隔协议书
2014/10/23 职场文书
大学生个人学习总结
2015/02/15 职场文书
军事博物馆观后感
2015/06/05 职场文书
责任书格式
2019/04/18 职场文书
详解Python为什么不用设计模式
2021/06/24 Python