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 相关文章推荐
JavaScript中输出标签的方法
Aug 27 Javascript
jQuery实现数秒后自动提交form的方法
Mar 05 Javascript
一系列Bootstrap导航条使用方法分享
Apr 29 Javascript
JS实现列表的响应式排版(推荐)
Sep 01 Javascript
jQuery自定义图片上传插件实例代码
Apr 04 jQuery
使用JavaScript实现node.js中的path.join方法
Aug 12 Javascript
js实现json数组分组合并操作示例
Feb 12 Javascript
vue elementUI使用tabs与导航栏联动
Jun 21 Javascript
使用Layer组件弹出多个对话框(非嵌套)与关闭及刷新的例子
Sep 25 Javascript
JavaScript Array.flat()函数用法解析
Sep 02 Javascript
js屏蔽F12审查元素,禁止修改页面代码等实现代码
Oct 02 Javascript
VUE+Element实现增删改查的示例源码
Nov 23 Vue.js
第一次接触神奇的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
require(),include(),require_once()和include_once()区别
2008/03/27 PHP
php面向对象全攻略 (十一)__toString()用法 克隆对象 __call处理调用错误
2009/09/30 PHP
phpQuery占用内存过多的处理方法
2013/11/13 PHP
PHP把小数转成整数3种方法
2014/06/30 PHP
PHP+原生态ajax实现的省市联动功能详解
2017/08/15 PHP
laravel框架实现去掉URL中index.php的方法
2019/10/12 PHP
Javascript 实现TreeView CheckBox全选效果
2010/01/11 Javascript
客户端js性能优化小技巧整理
2013/11/05 Javascript
JavaScript获取table中某一列的值的方法
2014/05/06 Javascript
函数式 JavaScript(一)简介
2014/07/07 Javascript
javascript笛卡尔积算法实现方法
2015/04/08 Javascript
jquery+php实现滚动的数字特效
2015/11/29 Javascript
jQuery中attr()与prop()函数用法实例详解(附用法区别)
2015/12/29 Javascript
Bootstrap每天必学之响应式导航、轮播图
2016/04/25 Javascript
javascript的理解及经典案例分析
2016/05/20 Javascript
Google 地图类型详解及示例代码
2016/08/06 Javascript
webix+springmvc session超时跳转登录页面
2016/10/30 Javascript
浅谈js函数三种定义方式 & 四种调用方式 & 调用顺序
2017/02/19 Javascript
详解EasyUi控件中的Datagrid
2017/08/23 Javascript
Thinkphp5微信小程序获取用户信息接口的实例详解
2017/09/26 Javascript
vue-resource请求实现http登录拦截或者路由拦截的方法
2018/07/11 Javascript
微信小程序实现选项卡效果
2018/11/06 Javascript
javascript实现滚动条效果
2020/03/24 Javascript
在vue中使用jsonp进行跨域请求接口操作
2020/10/29 Javascript
python和C语言混合编程实例
2014/06/04 Python
python Selenium实现付费音乐批量下载的实现方法
2019/01/24 Python
python requests抓取one推送文字和图片代码实例
2019/11/04 Python
如何基于Python pygame实现动画跑马灯
2020/11/18 Python
一些Solaris面试题
2013/03/22 面试题
大学生村官典型材料
2014/01/12 职场文书
毕业生自荐书
2014/02/03 职场文书
2014年机关党建工作总结
2014/11/11 职场文书
写给女朋友的检讨书
2015/05/06 职场文书
2016年小学圣诞节活动总结
2016/03/31 职场文书
golang三种设计模式之简单工厂、方法工厂和抽象工厂
2022/04/10 Golang
vue数据字典取键值项目的字典问题
2022/04/12 Vue.js