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 相关文章推荐
在IE上直接编辑网页内容的js代码(IE地址栏js)
Apr 27 Javascript
jQuery 解析xml文件
Aug 09 Javascript
基于Jquery的淡入淡出的特效基础练习
Dec 13 Javascript
Javascript面向对象之四 继承
Feb 08 Javascript
jquery foreach使用示例
Sep 12 Javascript
jQuery的ready方法详解
Nov 27 Javascript
JavaScript实现穷举排列(permutation)算法谜题解答
Dec 29 Javascript
jQuery多个版本和其他js库冲突的解决方法
Aug 11 Javascript
vue.js树形组件之删除双击增加分支实例代码
Feb 28 Javascript
基于ES6 Array.of的用法(实例讲解)
Sep 05 Javascript
JavaScript禁止右击保存图片,禁止拖拽图片的实现代码
Apr 28 Javascript
js前端对于大量数据的展示方式及处理方法
Dec 02 Javascript
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调用google接口生成二维码示例
2014/04/28 PHP
模板引擎smarty工作原理以及使用示例
2014/05/25 PHP
php_screw安装使用教程(另一个PHP代码加密实现)
2014/05/29 PHP
Yii2 中实现单点登录的方法
2018/03/09 PHP
改进:论坛UBB代码自动插入方式
2006/12/22 Javascript
JavaScript的面向对象编程基础
2015/08/13 Javascript
jquery实现图片上传前本地预览功能
2016/05/10 Javascript
浅谈js的ajax的异步和同步请求的问题
2016/10/07 Javascript
Angular2利用组件与指令实现图片轮播组件
2017/03/27 Javascript
jQuery查找和过滤_动力节点节点Java学院整理
2017/07/04 jQuery
Three.js利用顶点绘制立方体的方法详解
2017/09/27 Javascript
jQuery选择器之属性过滤选择器详解
2017/09/28 jQuery
js处理包含中文的字符串实例
2017/10/11 Javascript
基于Nodejs的Tcp封包和解包的理解
2018/09/19 NodeJs
了解javascript中变量及函数的提升
2019/05/27 Javascript
layui 上传插件 带预览 非自动上传功能的实例(非常实用)
2019/09/23 Javascript
js基础之事件捕获与冒泡原理
2019/10/09 Javascript
详解小程序如何改变onLoad的执行时机
2019/11/01 Javascript
基于redis的小程序登录实现方法流程分析
2020/05/25 Javascript
vue+vuex+axios从后台获取数据存入vuex,组件之间共享数据操作
2020/07/31 Javascript
[05:43]VG.R战队教练Mikasa专访:为目标从未停止战斗
2016/08/02 DOTA
[01:07:46]完美世界DOTA2联赛循环赛 Magma vs IO BO2第二场 11.01
2020/11/02 DOTA
Python排序搜索基本算法之堆排序实例详解
2017/12/08 Python
Pandas之Fillna填充缺失数据的方法
2019/06/25 Python
django框架创建应用操作示例
2019/09/26 Python
Django跨域资源共享问题(推荐)
2020/03/09 Python
Python如何脚本过滤文件中的注释
2020/05/27 Python
Python面向对象特殊属性及方法解析
2020/09/16 Python
python中round函数保留两位小数的方法
2020/12/04 Python
python 实现全球IP归属地查询工具
2020/12/18 Python
H5 meta小结(前端必看篇)
2016/08/24 HTML / CSS
Java的类与C++的类有什么不同
2014/01/18 面试题
校园文化标语
2014/06/18 职场文书
含预算的公司户外活动方案
2014/08/16 职场文书
基层组织建设年活动总结
2015/05/09 职场文书
如何使用python包中的sched事件调度器
2022/04/30 Python