教程集 www.jiaochengji.com
教程集 >  脚本编程  >  javascript  >  正文 js自适应图片宽高示例代码

js自适应图片宽高示例代码

发布时间:2015-05-06   编辑:jiaochengji.com
分享一例js实现的自适应图片宽高的代码,很实用的一段js代码,有需要的朋友做个参考。

本节内容:
js实现自适应图片宽高。

代码:
 

复制代码 代码示例:
<script type="text/javascript" language="javascript">
function fixImage(i,w,h){
    var ow = i.width;
    var oh = i.height;
    var rw = w/ow;
    var rh = h/oh;
    var r = Math.min(rw,rh);
    if (w ==0 && h == 0){
        r = 1;
    }else if (w == 0){
        r = rh<1?rh:1;
    }else if (h == 0){
        r = rw<1?rw:1;
    }
    if (ow!=0 && oh!=0){
    i.width = ow * r;
    i.height = oh * r;
    }else{
      var __method = this, args = $A(arguments);
        window.setTimeout(function() {
          fixImage.apply(__method, args);
        }, 200);
    }
    i.onload = function(){}
}
</script>

用法:
 

复制代码 代码示例:
<img src="" onload="fixImage(this,100,100)">

您可能感兴趣的文章:
JS获取图片宽高并根据图片大小自适应
js自适应图片宽高示例代码
js等比例缩放图片的实现方法
js控制iframe高度/宽度自适应
手机浏览器图片自适应高度问题解决办法
js判断屏幕分辨率的小例子
js获取图片宽高简单示例
php 获取图片宽高等信息详解
jQuery动态改变图片显示大小(示例代码)
jQuery实现等比例缩放大图片让大图片自适应页面布局

[关闭]
~ ~