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 相关文章推荐
滚动条变色 隐藏滚动条与双击网页自动滚屏显示代码
Dec 28 Javascript
js正则表达式的使用详解
Jul 09 Javascript
javascript中expression的用法整理
May 13 Javascript
浅谈javascript中的call、apply、bind
Mar 06 Javascript
jquery 获取select数组与name数组长度的实现代码
Jun 20 Javascript
jQuery解决input元素的blur事件和其他非表单元素的click事件冲突问题
Aug 15 Javascript
使用Ajax生成的Excel文件并下载的实例
Nov 21 Javascript
js实现自动图片轮播代码
Mar 22 Javascript
vue自定义全局组件(自定义插件)的用法
Jan 30 Javascript
讲解vue-router之什么是动态路由
May 28 Javascript
浅谈super-vuex使用体验
Jun 25 Javascript
vue.js实现会动的简历(包含底部导航功能,编辑功能)
Apr 08 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实现WEB动态网页静态
2006/10/09 PHP
php中常用字符串处理代码片段整理
2011/11/07 PHP
PHP中round()函数对浮点数进行四舍五入的方法
2014/11/19 PHP
PHP操作FTP类 (上传、下载、移动、创建等)
2016/03/31 PHP
Yii中srbac权限扩展模块工作原理与用法分析
2016/07/14 PHP
利用php抓取蜘蛛爬虫痕迹的示例代码
2016/09/30 PHP
如何在PHP中生成随机数
2020/06/04 PHP
用正则获取指定路径文件的名称
2007/02/27 Javascript
动态样式类封装JS代码
2009/09/02 Javascript
JavaScript解析json格式数据简单示例
2014/12/09 Javascript
使用Sticker.js实现贴纸效果
2015/01/28 Javascript
QQ登录背景闪动效果附效果演示源码下载
2015/09/22 Javascript
JS获取字符串实际长度(包含汉字)的简单方法
2016/08/11 Javascript
JavaScript之cookie技术详解
2016/11/18 Javascript
JavaScript之Vue.js【入门基础】
2016/12/06 Javascript
js实现百度地图定位于地址逆解析,显示自己当前的地理位置
2016/12/08 Javascript
jQuery实现弹窗居中效果类似alert()
2017/02/27 Javascript
js仿网易表单及时验证功能
2017/03/07 Javascript
jQuery中的deferred对象和extend方法详解
2017/05/08 jQuery
vue input输入框关键字筛选检索列表数据展示
2020/10/26 Javascript
Vue学习之axios的使用方法实例分析
2020/01/06 Javascript
python3使用PyMysql连接mysql数据库实例
2017/02/07 Python
Python中的id()函数指的什么
2017/10/17 Python
pandas DataFrame索引行列的实现
2019/06/04 Python
解决pyecharts在jupyter notebook中使用报错问题
2020/04/23 Python
在SQLite-Python中实现返回、查询中文字段的方法
2019/07/17 Python
利用 Flask 动态展示 Pyecharts 图表数据方法小结
2019/09/04 Python
Python任务调度利器之APScheduler详解
2020/04/02 Python
Jack Rogers官网:美国经典的女性鞋靴品牌
2019/09/04 全球购物
瑞士男士时尚网上商店:Babista
2020/05/14 全球购物
学员自我鉴定
2014/03/19 职场文书
戒毒悔改检讨书
2014/09/21 职场文书
2014年团总支工作总结
2014/11/21 职场文书
2016孝老爱亲模范事迹材料
2016/02/26 职场文书
使用Vue3+Vant组件实现App搜索历史记录功能(示例代码)
2021/06/09 Vue.js
详解Python如何批量采集京东商品数据流程
2022/01/22 Python