已知:
<ul> <li><img src="#"></li> <li><img src="#"></li> <li><img src="#"></li> <li><img src="#"></li> <li><img src="#"></li> <li><img src="#"></li> …… </ul>
n个li,其中的图片宽度都一样,而高度不统一
求助:
如果图片高度大于200px,用jQuery完成图片属性增加
style="position:relative; top:-((图片高度-200)/2)px"
$('ul li img').each(function (index, item) { this.onload = function () { var img_height = $(this).height(); if (img_height > 200) { $(this).css({position: 'relative', top: -((img_height - 200) / 2) + 'px'}) } }; })
$(document).ready(function()
{
$('ul li img').each(function() {
var maxHeight = 200;
var height = $(this).height();
if(height > maxHeight){
$(this).css({position: 'relative', top: -((height - 200) / 2) + 'px'})
};
});
});