我正在尝试使用顶部的固定图像创建响应行为,并希望实现以下内容捕捉到包含图像的 div 的底部,但位置为 fixed 的图像没有给 div 高度, 你能指出我哪里出了问题吗?是否还有其他方法可以实现?
.slider {
height: auto;
width: 100%;
}
.image {
width: 100%;
position: fixed;
z-index: -1;
top: 0;
}
.content {
height: 1100px;
background-color: black;
width: 100%;
z-index: 100;
margin-top: 350px;
position: relative;
}
<div class='slider'>
<img class='image' src='http://s2.postimg.org/vmnzo6e0p/top.jpg'>
</div>
<div class='content'>
</div>
最佳答案
也许您正在使用 JQuery 寻找类似的东西:https://jsfiddle.net/9hmyr40w/
CSS:
body{
margin: 0px;
}
.slider {
height: auto;
width: 100%;
}
.image {
width: 100%;
position: fixed;
z-index: -1;
top: 0;
}
.content {
height: 1100px;
background-color: black;
width: 100%;
z-index: 100;
position: relative;
}
JQuery:
$(window).on("load resize", function() {
var imageBottom = $(".image").height() - 15
$(".content").css("top",imageBottom)
})
关于html - 将 div 高度设置为与流体图像高度相同,如果(图像位置 : fixed),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35025325/