如何獲取圖像的圖像高度以設置另一個div高度

我擁有圖像高度不同的圖像（#myimage）。還有一個疊加層（#overlay），它應該完全覆蓋這個圖像。我已將覆蓋率設置爲100％，這對我來說不起作用，因爲有#somethingtuff不應覆蓋覆蓋層。如何獲取圖像的圖像高度以設置另一個div高度

問題是，如何確定#myimage的圖像高度？不知道高度會是多少？雖然它應該在高度上變化。所以寬度是100％，高度是自動的。

<div id="container"> 
    <img id="myimage" src="image.png"> 
    <div id="overlay"> 
     <img src="overlay.png"> 
    </div> 
<div id="someotherstuff"> 
// some other stuff not to cover 
</div> 
</div>

CSS

#myimage {width:100%;height:auto;} 
#overlay { position: absolute; top: 0; left: 0; height: 100%; width: 100%;}

來源

2014-10-20 Marc Ster

是jQuery的或JavaScript中的選項？ – Benjamin 2014-10-20 15:34:16

如果需要是 – 2014-10-20 15:34:36

爲什麼不把主圖像放在覆蓋圖中，然後使用覆蓋圖像作爲覆蓋圖元素背景？這應該由純CSS完成。 – Shomz 2014-10-20 15:35:13

用jQuery做到這一點：

$(document).ready(function(){ 
    image_height = $("#myimage").height(); 
    $("#overlay").height(image_height); 
});

來源

2014-10-20 15:37:00 IVIajid

這對我來說非常合適。謝謝:) – 2014-10-20 15:54:39

很高興@MarcSter :) – IVIajid 2014-10-20 16:22:57

如何獲取圖像的圖像高度以設置另一個div高度

回答

相關問題