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 相关文章推荐
用js实现的一个Flash滚动轮换显示图片代码生成器
Mar 14 Javascript
xml 封装与解析(javascript和C#中)
Jul 26 Javascript
JavaScript学习笔记(十)
Jan 17 Javascript
在js(jquery)中获得文本框焦点和失去焦点的方法
Dec 04 Javascript
多次注册事件会导致一个事件被触发多次的解决方法
Aug 12 Javascript
Jquery实现控件的隐藏和显示实例
Feb 08 Javascript
JS面向对象基础讲解(工厂模式、构造函数模式、原型模式、混合模式、动态原型模式)
Aug 16 Javascript
纯JavaScript实现的分页插件实例
Jul 14 Javascript
js提交form表单,并传递参数的实现方法
May 25 Javascript
在layui中layer弹出层点击事件无效的解决方法
Sep 05 Javascript
angular inputNumber指令输入框只能输入数字的实现
Dec 03 Javascript
在Vue.js中使用TypeScript的方法
Mar 19 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实现过滤表单提交中html标签的方法
2014/10/17 PHP
discuz图片顺序混乱解决方案
2015/07/29 PHP
php开发工具有哪五款
2015/11/09 PHP
PHP实现补齐关闭的HTML标签
2016/03/22 PHP
PHP针对多用户实现更换头像功能
2016/09/04 PHP
详细解读php的命名空间(二)
2018/02/21 PHP
safari下载文件自动加了html后缀问题
2018/11/09 PHP
Domino中运用jQuery读取视图内容的方法
2009/10/21 Javascript
精通JavaScript 纠正 cleanWhitespace函数
2010/03/11 Javascript
jQuery的实现原理的模拟代码 -1 核心部分
2010/08/01 Javascript
JS实现仿QQ面板的手风琴效果折叠菜单代码
2015/09/11 Javascript
可输入文字查找ajax下拉框控件 ComBox的实现方法
2016/10/25 Javascript
使用vue-cli打包过程中的步骤以及问题的解决
2018/05/08 Javascript
webpack4+Vue搭建自己的Vue-cli项目过程分享
2018/08/29 Javascript
详解JavaScript实现动态的轮播图效果
2019/04/29 Javascript
vue-router二级导航切换路由及高亮显示的实现方法
2019/07/10 Javascript
Vue.js原理分析之nextTick实现详解
2020/09/07 Javascript
jquery插件实现轮播图效果
2020/10/19 jQuery
[04:29]【TI9采访】OG.N0tail在胜者组决赛后接受采访
2019/08/25 DOTA
使用Python的PEAK来适配协议的教程
2015/04/14 Python
Python中的localtime()方法使用详解
2015/05/22 Python
简单实现Python爬取网络图片
2018/04/01 Python
Python解析json代码实例解析
2019/11/25 Python
pytorch dataloader 取batch_size时候出现bug的解决方式
2020/02/20 Python
六道php面试题附答案
2014/06/05 面试题
Ibatis的核心配置文件都有什么
2014/09/08 面试题
你所在的项目是如何确定版本号的
2015/12/28 面试题
学前教育毕业生自荐信范文
2013/12/24 职场文书
餐饮商业计划书范文
2014/04/29 职场文书
大学生学习面向未来的赶考思想汇报
2014/09/12 职场文书
2014年国庆节庆祝建国65周年比赛演讲稿
2014/09/21 职场文书
学位证书委托书
2014/09/30 职场文书
文明单位汇报材料
2014/12/24 职场文书
Python机器学习之基础概述
2021/05/19 Python
总结python多进程multiprocessing的相关知识
2021/06/29 Python
Win11怎么修改电源模式?Win11修改电源模式的方法
2022/04/05 数码科技