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 相关文章推荐
关于js遍历表格的实例
Jul 10 Javascript
JavaScript获取DOM元素的11种方法总结
Apr 25 Javascript
JavaScript动态插入CSS的方法
Dec 10 Javascript
在AngularJS中使用jQuery的zTree插件的方法
Apr 21 Javascript
Angularjs 创建可复用组件实例代码
Oct 09 Javascript
jQuery Mobile漏洞会有跨站脚本攻击风险
Feb 12 Javascript
js date 格式化
Feb 15 Javascript
Angular.js跨controller实现参数传递的两种方法
Feb 20 Javascript
QRCode.js:基于JQuery的生成二维码JS库的使用
Jun 23 jQuery
windows下更新npm和node的方法
Nov 30 Javascript
原生js实现随机点餐效果
Dec 10 Javascript
JavaScript检测浏览器是否支持CSS变量代码实例
Apr 03 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
要会喝咖啡也要会知道咖啡豆
2021/03/03 咖啡文化
PHP脚本的10个技巧(1)
2006/10/09 PHP
php date()日期时间函数详解
2010/05/16 PHP
PHP实现获取FLV文件的时间
2015/02/10 PHP
详解php curl带有csrf-token验证模拟提交方法
2018/04/18 PHP
JS动态显示表格上下frame的方法
2015/03/31 Javascript
JavaScript面对国际化编程时的一些建议
2015/06/24 Javascript
js模仿php中strtotime()与date()函数实现方法
2015/08/11 Javascript
js操作table元素实现表格行列新增、删除技巧总结
2015/11/18 Javascript
如何用JavaScript实现动态修改CSS样式表
2016/05/20 Javascript
CSS3 3D 技术手把手教你玩转
2016/09/02 Javascript
把json格式的字符串转换成javascript对象或数组的方法总结
2016/11/03 Javascript
layui前段框架日期控件使用方法详解
2017/05/19 Javascript
vue-resouce设置请求头的三种方法
2017/09/12 Javascript
解决vue 更改计算属性后select选中值不更改的问题
2018/03/02 Javascript
react-native使用leanclound消息推送的方法
2018/08/06 Javascript
three.js实现圆柱体
2018/12/30 Javascript
javascript设计模式 ? 建造者模式原理与应用实例分析
2020/04/10 Javascript
Javascript基于OOP实实现探测器功能代码实例
2020/08/26 Javascript
python检查指定文件是否存在的方法
2015/07/06 Python
python3中zip()函数使用详解
2018/06/29 Python
对python 多个分隔符split 的实例详解
2018/12/20 Python
python实现对输入的密文加密
2019/03/20 Python
Pytorch.nn.conv2d 过程验证方式(单,多通道卷积过程)
2020/01/03 Python
Python破解BiliBili滑块验证码的思路详解(完美避开人机识别)
2020/02/17 Python
django ObjectDoesNotExist 和 DoesNotExist的用法
2020/07/09 Python
Python调用ffmpeg开源视频处理库,批量处理视频
2020/11/16 Python
python 使用openpyxl读取excel数据
2021/02/18 Python
CSS实现圆形放大镜狙击镜效果 只有圆圈里的放大
2012/12/10 HTML / CSS
酒店管理自荐信
2013/10/23 职场文书
社区消防工作实施方案
2014/03/21 职场文书
英语一分钟演讲稿
2014/04/29 职场文书
2015年幼儿园安全工作总结
2015/05/12 职场文书
Python可视化学习之matplotlib内置单颜色
2022/02/24 Python
铁拳制作人赞《铁拳7》老头环Mod:制作精良 但别弄了
2022/04/03 其他游戏
Python实现视频自动打码的示例代码
2022/04/08 Python