javascript - 如何获取图像的图像高度以设置另一个div高度

标签 javascript html css

我有图像 (#myimage),图像高度不同。还有一个叠加层 (#overlay),它应该恰好位于该图像之上。我已将覆盖设置为 100%,这对我不起作用,因为有 #someotherstuff 不应从覆盖中覆盖..

问题是,如果我不知道#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%;}

最佳答案

用 jquery 做这个:

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

关于javascript - 如何获取图像的图像高度以设置另一个div高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26469451/

相关文章:

javascript - 希望将客户端生成的二进制文件保存到客户端计算机

html - 页脚不显示?

html - CSS 定位 - 固定居中 - 固定左侧和固定右侧元素

css - Bootstrap 中可水平滚动的卡片列表

javascript - 为什么在 $.post 方法中使用时全局 var 类型变量在 $.each 之外不可访问?

javascript - jQuery .next() 元素

javascript - 根据鼠标位置自动滚动div中的图标

javascript - 使div中的内容不可编辑(可点击)

javascript - 为什么我不能使用自定义选定属性?

css - p 标签文本位于页面后面