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 相关文章推荐
jq选项卡鼠标延迟的插件实例
May 13 Javascript
一个通过script自定义属性传递配置参数的方法
Sep 15 Javascript
JavaSacript中charCodeAt()方法的使用详解
Jun 05 Javascript
JavaScript中的Math.SQRT1_2属性使用简介
Jun 14 Javascript
JS动态添加iframe的代码
Sep 14 Javascript
Javascript中字符串replace方法的第二个参数探究
Dec 05 Javascript
微信小程序页面开发注意事项整理
May 18 Javascript
基于JavaScript实现评论框展开和隐藏功能
Aug 25 Javascript
详解webpack + react + react-router 如何实现懒加载
Nov 20 Javascript
详解如何在Vue里建立长按指令
Aug 20 Javascript
Vue封装的可编辑表格插件方法
Aug 28 Javascript
vue.js 2.0实现简单分页效果
Jul 29 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新手上路(四)
2006/10/09 PHP
关于初学PHP时的知识积累总结
2013/06/07 PHP
PHP中遇到BOM、编码导致json_decode函数无法解析问题
2014/07/02 PHP
PHP查询附近的人及其距离的实现方法
2016/05/11 PHP
Laravel 微信小程序后端实现用户登录的示例代码
2019/11/26 PHP
屏蔽鼠标右键、Ctrl+n、shift+F10、F5刷新、退格键 的javascript代码
2007/04/01 Javascript
符合W3C网页标准的iframe标签的使用方法
2007/07/19 Javascript
Ext.MessageBox工具类简介
2009/12/10 Javascript
jquery.simple.tree插件 更简单,兼容性更好的无限树插件
2010/09/03 Javascript
IE关闭时判断及AJAX注销案例学习
2013/02/18 Javascript
一个简单的瀑布流效果(主体形式自写)
2013/05/27 Javascript
javascript完美拖拽的实现方法
2013/09/29 Javascript
nodejs获取本机内网和外网ip地址的实现代码
2014/06/01 NodeJs
JavaScript支持的最大递归调用次数分析
2014/06/24 Javascript
Javascript通过overflow控制列表闭合与展开的方法
2015/05/15 Javascript
JavaScript获取页面中超链接数量的方法
2015/11/09 Javascript
jQuery-1.9.1源码分析系列(十一)DOM操作续之克隆节点
2015/12/01 Javascript
判断数组是否包含某个元素的js函数实现方法
2016/05/19 Javascript
Bootstrap fileinput文件上传预览插件使用详解
2017/05/16 Javascript
详解vue服务端渲染(SSR)初探
2017/06/19 Javascript
jQuery基于闭包实现的显示与隐藏div功能示例
2018/06/09 jQuery
Django+Vue跨域环境配置详解
2018/07/06 Javascript
Node.js 使用request模块下载文件的实例
2018/09/05 Javascript
vue+vant实现商品列表批量倒计时功能
2020/01/13 Javascript
详解VUE中的插值( Interpolation)语法
2020/10/18 Javascript
解决Antd 里面的select 选择框联动触发的问题
2020/10/24 Javascript
python自动zip压缩目录的方法
2015/06/28 Python
python 实现dict转json并保存文件
2019/12/05 Python
删除pycharm鼠标右键快捷键打开项目的操作
2021/01/16 Python
CSS 3.0文字悬停跳动特效代码
2020/10/26 HTML / CSS
世界上最大的汽车共享网站:Zipcar
2017/01/14 全球购物
新学期班主任寄语
2014/01/18 职场文书
《画风》教学反思
2014/04/16 职场文书
个人党性锻炼总结
2015/03/05 职场文书
环保主题班会教案
2015/08/13 职场文书
Python 绘制多因子柱状图
2022/05/11 Python