.divImg{
width:233px;
height:214px;
border:1px solid #e5e5e5;
overflow: hidden;
text-align: center;
}
<div class="divImg">
<img src="path">
</div>
主要是设置Img标签外层div样式,overflow: hidden;
$("img").load(function(){
$.each($(".divImg>a>img"),function(){
drawImage(this,233,214);//动态设置宽高值
});
});
function drawImage(ImgD, FitWidth, FitHeight) {
var image = new Image();
image.src = ImgD.src;
if (image.width > 0 && image.height > 0){
var width = image.width;
var height = image.height;
if(width > FitWidth){
if(width>height){
$(ImgD).css("height","100%");
}
else if(width<height){
$(ImgD).css("width","100%");
}else{
//相等(正方形)
$(ImgD).css("width","100%");
$(ImgD).css("height","100%");
}
}
}}
超宽:
原图:
超高:
原图:
注意:我这里系统的图片宽度永远大于我设定的值,所以只判断了宽,高度判断可以增加