解决移动端等比例图片上下左右居中的方法

最新推荐文章于 2021-08-13 18:30:55 发布

weixin_34250434

最新推荐文章于 2021-08-13 18:30:55 发布

阅读量317

点赞数

原文链接：https://my.oschina.net/sycbbb/blog/1477126

版权

为什么80%的码农都做不了架构师？>>>

 function imgTheMiddle(obj,objImg) {
        var imgObjWidth=obj.width(),imgObjHeight=obj.height(),imgObjImgWidth=objImg.width(),imgObjImgHeight=objImg.height();
        if(imgObjWidth==imgObjImgWidth && imgObjHeight>imgObjImgHeight){
            objImg.css({
                maxHeight:"100%",
                width:"auto"
            });
            var imgObjWidth2=obj.width(),imgObjHeight2=obj.height(),imgObjImgWidth2=objImg.width(),imgObjImgHeight2=objImg.height();
            if(imgObjImgWidth2>imgObjWidth2 && imgObjHeight2==imgObjImgHeight2){
                objImg.css({
                    "margin-left":-((imgObjImgWidth2-imgObjWidth2)/2)
                });
            }
        }else if(imgObjWidth==imgObjImgWidth && imgObjHeight<imgObjImgHeight){
            objImg.css({
                "margin-top":-((imgObjImgHeight-imgObjHeight)/2)
            });
        }else if(imgObjHeight==imgObjImgHeight && imgObjWidth>imgObjImgWidth){
            objImg.css({
                hegiht:"auto",
                maxWidth:"100%"
            });
        }
    }

 imgTheMiddle($(".info .info-content .room-img"),$(".info .info-content .room-img img"));

转载于:https://my.oschina.net/sycbbb/blog/1477126