js实现兼容IE、Firefox的图片缩放代码


Posted in Javascript onDecember 08, 2015

本文实例讲述了js实现兼容IE、Firefox的图片缩放代码。分享给大家供大家参考,具体如下:

function SetSize(obj, width, height) {
  myImage = new Image();
  myImage.src = obj.src;
  if (myImage.width > 0 && myImage.height > 0) {
    var rate = 1;
    if (myImage.width > width || myImage.height > height) {
      if (width / myImage.width < height / myImage.height) {
        rate = width / myImage.width;
      } else {
        rate = height / myImage.height;
      }
    }
    if (window.navigator.appName == "Microsoft Internet Explorer") {
      obj.style.zoom = rate;
    } else {
      obj.width = myImage.width * rate;
      obj.height = myImage.height * rate;
    }
  }
}

用法:

<img src="img/offer/41936519.jpg" border="0" style="zoom: 0.1" onload="SetSize(this, 80, 60)"/>

这种方法在IE、FIREFOX、OPERA、NETSCAPE测试都适用。

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

Javascript 相关文章推荐
javascript 动态table添加colspan\rowspan 参数的方法
Jul 25 Javascript
offsetParent 算法分析
Apr 05 Javascript
iframe的父子窗口之间的对象相互调用基本用法
Sep 03 Javascript
使用原生js封装webapp滑动效果(惯性滑动、滑动回弹)
May 06 Javascript
jquery mobile 实现自定义confirm确认框效果的简单实例
Jun 17 Javascript
Angularjs单选改为多选的开发过程及问题解析
Feb 17 Javascript
angularjs实现分页和搜索功能
Jan 03 Javascript
vue 实现类似淘宝星级评分的示例
Mar 01 Javascript
electron中使用bootstrap的示例代码
Nov 06 Javascript
一份超级详细的Vue-cli3.0使用教程【推荐】
Nov 15 Javascript
微信小程序学习总结(四)事件与冒泡实例分析
Jun 04 Javascript
Vue如何实现变量表达式选择器
Feb 18 Vue.js
JS实现按比例缩放图片的方法(附C#版代码)
Dec 08 #Javascript
JS获取文件大小方法小结
Dec 08 #Javascript
js+ajax实现获取文件大小的方法
Dec 08 #Javascript
JS表格组件神器bootstrap table详解(基础版)
Dec 08 #Javascript
详解js中构造流程图的核心技术JsPlumb(2)
Dec 08 #Javascript
详解js中构造流程图的核心技术JsPlumb
Dec 08 #Javascript
jQuery遮罩层实现方法实例详解(附遮罩层插件)
Dec 08 #Javascript
You might like
PHP 最大运行时间 max_execution_time修改方法
2010/03/08 PHP
PHP 事件机制(2)
2011/03/23 PHP
支持中文的PHP按字符串长度分割成数组代码
2015/05/17 PHP
静态的动态续篇之来点XML
2006/12/23 Javascript
JavaScript Cookie的读取和写入函数
2009/12/08 Javascript
基于jquery的图片幻灯展示源码
2012/07/15 Javascript
javascript数组详解
2014/10/22 Javascript
javascript框架设计读书笔记之数组的扩展与修复
2014/12/02 Javascript
node.js中的fs.createWriteStream方法使用说明
2014/12/17 Javascript
jquery图片倾斜层叠切换特效代码分享
2015/08/27 Javascript
jQuery ajax分页插件实例代码
2016/01/27 Javascript
修改jquery中dialog的title属性方法(推荐)
2016/08/26 Javascript
javascript 将共享属性迁移到原型中去的实现方法
2016/08/31 Javascript
浅谈js中的变量名和函数名重名
2017/02/13 Javascript
基于rollup的组件库打包体积优化小结
2018/06/18 Javascript
vue中动态添加class类名的方法
2018/09/05 Javascript
一秒学会微信小程序制作table表格
2019/02/14 Javascript
使用nodejs分离html文件里的js和css详解
2019/04/12 NodeJs
解决Vue-cli无法编译es6的问题
2020/10/30 Javascript
Python 迭代器与生成器实例详解
2017/05/18 Python
Django objects.all()、objects.get()与objects.filter()之间的区别介绍
2017/06/12 Python
python MNIST手写识别数据调用API的方法
2018/08/08 Python
Python实现链表反转的方法分析【迭代法与递归法】
2020/02/22 Python
Python处理PDF与CDF实例
2020/02/26 Python
关于python 的legend图例,参数使用说明
2020/04/17 Python
tensorflow之读取jpg图像长和宽实例
2020/06/18 Python
13个Pandas实用技巧,助你提高开发效率
2020/08/19 Python
Python自动化xpath实现自动抢票抢货
2020/09/19 Python
接口自动化多层嵌套json数据处理代码实例
2020/11/20 Python
Keras保存模型并载入模型继续训练的实现
2021/02/20 Python
俄罗斯花园种植材料批发和零售网上商店:Беккер
2019/07/22 全球购物
《九色鹿》教学反思
2014/02/27 职场文书
2014年药店工作总结
2014/11/20 职场文书
2015年保洁员工作总结
2015/05/04 职场文书
公司档案管理制度
2015/08/05 职场文书
创业计划书之牛肉汤快餐店
2019/10/08 职场文书