求教,能让图片在div中自适应尺寸且居中显示(非常规)的高效代码
需求描述:
DIV 宽与高固定,img 宽与高均大于 DIV ,且 img 宽高比不确定
将 img 按一定规则等比缩小后显示在 DIV 中,且 DIV 内上下左右均没有留白,效果如下:
如果:
img 宽高比 > DIV 宽高比,则最终 img 高 = DIV 高,而 img 宽 > DIV 宽,
此时将 img 左、右各截取或隐藏相同【宽度】的内容,在 DIV 内显示 img【水平】最中间的部分
如果:
img 宽高比 < DIV 宽高比,则最终 img 宽 = DIV 宽,而 img 高 > DIV 高,
此时将 img 上、下各截取或隐藏相同【高度】的内容,在 DIV 内显示 img【垂直】最中间的部分
网页中有多处容器用到该功能,且容器宽高均不相同,要求程序执行效率高。
我们的网站程序是PHP,之前用PHP自带的 getimagesize 函数判断图片尺寸,效率太低,导致网页打开太慢。
不知道是否可以用 CSS 、JS 或 jquery 实现。
请高手不吝赐教!拜谢!