Graent.Hu 的博客 - 刚好遇见你

新浪微薄腾讯微薄

最新碎语:最近感觉有些迷茫,怎么办~

您的位置:Graent.Hu 的博客 - 刚好遇见你 >其他> iOS下图片宽度固定,高度自适应的处理办法

iOS下图片宽度固定,高度自适应的处理办法

$("img").each(function(i){
    var img = $(this);
    var realWidth,realHeight,realT;//真实的高度
    var disWidth = img.width(),disHeight = img.height();
    var bi = disWidth / disHeight;
    //这里做下说明,$("<img/>")这里是创建一个临时的img标签,类似js创建一个new Image()对象!
    $("<img/>").attr("src", $(img).attr("src")).load(function() {
        /*
          如果要获取图片的真实的宽度和高度有三点必须注意
          1、需要创建一个image对象:如这里的$("<img/>")
          2、指定图片的src路径
          3、一定要在图片加载完成后执行如.load()函数里执行
         */
        realWidth = this.width;
        realHeight = this.height;
        realT = realHeight*disWidth/realWidth;
        $(img).css("height",realT+"px");
        //console.log(realT)
 
    });

});

原理比较简单,就是获取原始宽高计算出比例,然后在获取当前的宽度,以此求出当前应该显示的正确高度即可。

当然宽的自适应也是一样的计算方式。

转载请注明出处:

本文标题:iOS下图片宽度固定,高度自适应的处理办法

本文链接:https://www.wlyc.cn/post-217.html

发表评论

路人甲 表情
看不清楚?点图切换