javascript实现获取图片大小及图片等比缩放的方法


Posted in Javascript onNovember 24, 2016

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

获取图片大小:

var originImage = new Image();
function GetImageWidth(oImage) {
  if (originImage.src != oImage.src) originImage.src = oImage.src;
  return originImage.width;
}
function GetImageHeight(oImage) {
  if (originImage.src != oImage.src) originImage.src = oImage.src;
  return originImage.height;
}

图片等比缩放:

function SetImage(ImgD, FitWidth, FitHeight) {
  var image = new Image();
  image.src = ImgD.src;
  if (image.width > 0 && image.height > 0) {
    if (image.width / image.height >= FitWidth / FitHeight) {
      if (image.width > FitWidth) {
        ImgD.width = FitWidth;
        ImgD.height = (image.height * FitWidth) / image.width;
      } else {
        ImgD.width = image.width;
        ImgD.height = image.height;
      }
    } else {
      if (image.height > FitHeight) {
        ImgD.height = FitHeight;
        ImgD.width = (image.width * FitHeight) / image.height;
      } else {
        ImgD.width = image.width;
        ImgD.height = image.height;
      }
    }
  }
}

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

Javascript 相关文章推荐
javascript 动态table添加colspan\rowspan 参数的方法
Jul 25 Javascript
在子窗口中关闭父窗口的一句代码
Oct 21 Javascript
jQuery对下拉框,单选框,多选框的操作
Feb 21 Javascript
jQuery判断元素是否存在的可靠方法
May 06 Javascript
JavaScript数组函数unshift、shift、pop、push使用实例
Aug 27 Javascript
设计模式中的facade外观模式在JavaScript开发中的运用
May 18 Javascript
javascript如何创建对象
Aug 29 Javascript
vue实现百度搜索下拉提示功能实例
Jun 14 Javascript
浅析vue深复制
Jan 29 Javascript
2019 年编写现代 JavaScript 代码的5个小技巧(小结)
Jan 15 Javascript
js实现日历
Nov 07 Javascript
使用react-virtualized实现图片动态高度长列表的问题
May 28 Javascript
网站发布后Bootstrap框架引用woff字体无法正常显示的解决方法
Nov 24 #Javascript
Javascript 数组去重的方法(四种)详解及实例代码
Nov 24 #Javascript
BootStrap树状图显示功能
Nov 24 #Javascript
Bootstrop实现多级下拉菜单功能
Nov 24 #Javascript
AngularJS自定义服务与fliter的混合使用
Nov 24 #Javascript
微信小程序-详解数据缓存
Nov 24 #Javascript
如何实现json数据可视化详解
Nov 24 #Javascript
You might like
一个简洁实用的PHP缓存类完整实例
2014/07/26 PHP
php运行时动态创建函数的方法
2015/03/16 PHP
jQuery 技巧大全(新手入门篇)
2009/05/12 Javascript
现如今最流行的JavaScript代码规范
2014/03/08 Javascript
基于jQuery实现的美观星级评论打分组件代码
2015/10/30 Javascript
Jquery技巧(必须掌握)
2016/03/16 Javascript
JavaScript拖动层Div代码
2017/03/01 Javascript
详解探索 vuex 2.0 以及使用 vuejs 2.0 + vuex 2.0 构建记事本应用
2017/06/16 Javascript
JavaScript实现京东购物放大镜和选项卡效果的方法分析
2018/07/05 Javascript
layui-laydate时间日历控件使用方法详解
2018/11/15 Javascript
vue中实现Monaco Editor自定义提示功能
2019/07/05 Javascript
Vue3 的响应式和以前有什么区别,Proxy 无敌?
2020/05/20 Javascript
vue 实现根据data中的属性值来设置不同的样式
2020/08/04 Javascript
jQuery+ajax实现用户登录验证
2020/09/13 jQuery
JavaScript实现简易计算器小功能
2020/10/22 Javascript
python中xrange和range的区别
2014/05/13 Python
python urllib urlopen()对象方法/代理的补充说明
2017/06/29 Python
Python时间戳使用和相互转换详解
2017/12/11 Python
简单谈谈python中的lambda表达式
2018/01/19 Python
解决安装pyqt5之后无法打开spyder的问题
2019/12/13 Python
记录模型训练时loss值的变化情况
2020/06/16 Python
sqlalchemy实现时间列自动更新教程
2020/09/02 Python
关于Python错误重试方法总结
2021/01/03 Python
详解CSS 3 中的 calc() 方法
2018/01/12 HTML / CSS
Booking.com荷兰:全球酒店网上预订
2017/08/22 全球购物
英文自荐信格式
2013/11/28 职场文书
珠宝店促销方案
2014/03/21 职场文书
捐款倡议书格式范文
2014/05/14 职场文书
我爱幼儿园演讲稿
2014/09/11 职场文书
大学生入党积极分子党校学习思想汇报
2014/10/25 职场文书
学生保证书格式
2015/02/27 职场文书
2015年秋季小学开学典礼主持词
2015/07/16 职场文书
社会心理学学习心得体会
2016/01/22 职场文书
《中国机长》观后感:敬畏生命,敬畏职责
2019/11/12 职场文书
pytorch中Schedule与warmup_steps的用法说明
2021/05/24 Python
Mysql 如何查询时间段交集
2021/06/08 MySQL