固定定位元件顶部的流动物体
固定定位元件顶部的流动物体
提问于 2013-10-02 22:26:47
我看到了一个新的时尚网站是元素向下滚动，并消失在其他元素(例如，一个大的图像消失在白色背景上的文字)。我试图达到一个类似的效果，其中一个图像，是固定的位置，滚动后，的其他元素。我遇到的问题是，z索引对固定的定位元素没有影响，因为它们偏离了正常的流程。是否有css方法将固定元素定位在其他元素之后？
回答 1
Stack Overflow用户
发布于 2013-10-02 22:29:20
您可以做的一件事是将该元素的z-index设置为-1。但是，我认为您必须在上面的所有东西上放置一个position:relative;，因为如果我没有记错的话，有些浏览器会忽略具有position:static;的元素的z-index。另外，您是否考虑过简单地将该图像设置为带有css的页面的背景图像？
更新
由于我不知道您的代码的确切性质，所以我可以建议您如何完成这一任务的基本模型：
Fiddle:http://jsfiddle.net/jatN2/
CSS
#bg {
position:fixed;
height:100%;
width:100%;
z-index:-1;
}
#wrapper {
position:absolute;
z-index:1;
background:transparent;
}
body {
font-family:Arial, Helvetica, sans-serif;
background:transparent;
}
.content {
padding:20px;
background:#FFF;
margin:0px;
display:block;
}<img src="<!--Your background image here -->" id="bg" />
<div id="wrapper">
<div class="space"><!--Just a placeholder for the area where you want the background image to show. Give this element a height so it'll show the bg for that amount of height --></div>
<div class="content">
<!--Put your content here -->
</div>
</div>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19147830
复制相关文章
相似问题
腾讯云开发者
