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实现在小方框中浏览大图的代码
Aug 14 Javascript
javascript中如何处理引号编码&amp;#034;
Aug 15 Javascript
提升PHP安全:8个必须修改的PHP默认配置
Nov 17 Javascript
基于Node.js实现nodemailer邮件发送
Jan 26 Javascript
jQuery插件简单学习实例教程
Jul 01 Javascript
jQuery Validate验证表单时多个name相同的元素只验证第一个的解决方法
Dec 24 Javascript
详解vue项目构建与实战
Jun 27 Javascript
Node.js 8 中的重要新特性
Jun 28 Javascript
Vue服务端渲染实践之Web应用首屏耗时最优化方案
Mar 22 Javascript
Vue.js递归组件实现组织架构树和选人功能
Jul 04 Javascript
vue实现图片按比例缩放问题操作
Aug 11 Javascript
JavaScript async/await原理及实例解析
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 解决utf-8和gb2312编码转换问题
2010/03/18 PHP
PHP CLI模式下的多进程应用分析
2013/06/03 PHP
php中让上传的文件大小在上传前就受限制的两种解决方法
2013/06/24 PHP
php中memcache 基本操作实例
2015/05/17 PHP
thinkphp3.2点击刷新生成验证码
2016/02/16 PHP
常用PHP数组排序函数归纳
2016/08/08 PHP
php实现base64图片上传方式实例代码
2017/02/22 PHP
PHP中PCRE正则解析代码详解
2019/04/26 PHP
Packer 3.0 JS压缩及混淆工具 下载
2007/05/03 Javascript
javascript代码编写需要注意的7个小细节小结
2011/09/21 Javascript
基于jQuery选择器的整理集合
2013/04/26 Javascript
js控制input框只读实现示例
2014/01/20 Javascript
from表单多个按钮提交用onclick跳转不同action
2014/04/24 Javascript
使用text方法获取Html元素文本信息示例
2014/09/01 Javascript
js实现点击图片改变页面背景图的方法
2015/02/28 Javascript
Javascript类型转换的规则实例解析
2016/02/23 Javascript
微信小程序 require机制详解及实例代码
2016/12/14 Javascript
JavaScript简介_动力节点Java学院整理
2017/06/26 Javascript
JavaScript正则表达式的贪婪匹配和非贪婪匹配
2017/09/05 Javascript
element-ui和vue表单(对话框)验证提示语(残留)清除操作
2020/09/11 Javascript
[00:32]2018DOTA2亚洲邀请赛Newbee出场
2018/04/03 DOTA
对命令行模式与python交互模式介绍
2018/05/12 Python
python制作填词游戏步骤详解
2019/05/05 Python
python pytest进阶之conftest.py详解
2019/06/27 Python
土耳其玩具商店:Toyzz Shop
2019/08/02 全球购物
日本AOKI官方商城:AOKI西装
2020/06/11 全球购物
在网络中有两台主机A和B,并通过路由器和其他交换设备连接起来,已经确认物理连接正确无误,怎么来测试这两台机器是否连通?如果不通,怎么来判断故障点?怎么排
2014/01/13 面试题
机械系大学毕业生推荐信
2013/11/27 职场文书
长安大学毕业生自我鉴定
2014/01/17 职场文书
学生会副主席竞聘书
2014/03/31 职场文书
国旗下讲话演讲稿
2014/05/08 职场文书
企业承诺书格式
2014/05/21 职场文书
县长群众路线对照检查材料思想汇报
2014/10/02 职场文书
2014年档案管理员工作总结
2014/12/01 职场文书
个人总结与自我评价2015
2015/03/11 职场文书
幼儿园园长六一致辞
2015/07/31 职场文书