我使用以下代码在DIV中水平和垂直居中图像
给予DIV的属性是width
& height
,overflow:hidden
和display:block
。
问题:margin-top
和margin-left
仅在Chrome中计算错误,而代码在FF和IE中完美运行
$('.centerImage').each(function(i) {
var divH = $(this).parent().height();
var divW = $(this).parent().width();
var orgImgH = $(this).height();
var orgImgW = $(this).width();
if (orgImgH > orgImgW) {
$(this).css('width', divW);
var imgH = $(this).height();
var mTop = (divH - imgH) / 2;
$(this).css("margin-top", (mTop < 0) ? mTop : -mTop); //if margin-top value is less than 0 use as is and greater than 0 multiply by -1
} else {
$(this).css('height', divH);
var imgW = $(this).width();
var mLeft = (divW - imgW) / 2;
//alert(imgW); alert(mLeft); //chrome bug
$(this).css("margin-left", (mLeft < 0) ? mLeft : -mLeft);
}
});
有什么想法吗?