首頁(yè) 猿問(wèn) 如果圖片高度大于200px，用jQ...

如果圖片高度大于200px，用jQuery完成圖片屬性增加?

JavaScript JQuery

搖曳的薔薇 2023-04-30 11:07:36

已知：<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個(gè)li，其中的圖片寬度都一樣，而高度不統(tǒng)一求助：style="position:relative; top:-((圖片高度-200)/2)px"

查看完整描述

2 回答

梵蒂岡之花

TA貢獻(xiàn)1900條經(jīng)驗(yàn) 獲得超5個(gè)贊

$('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'})
        }
      };
    })

反對(duì) 回復(fù) 2023-05-03

慕碼人8056858

TA貢獻(xiàn)1803條經(jīng)驗(yàn) 獲得超6個(gè)贊

$(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'})  
    };  
  });  
});

反對(duì) 回復(fù) 2023-05-03