我正在尝试制作一个简单的背景图像,当我向下滚动页面时,它将保持不变。背景图像不会停留在原位。我已将背景附件设置为固定。
请访问:www.emergencydatascience.org
我的CSS代码:
background-image: url($background_image);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
z-index: -1;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
更多CSS(如果有帮助的话(:https://github.com/dighr/data-flood/blob/gh-pages/_sass/layout/_wrapper.scss
将.bg类移动到身体开始后的位置。你的#wrapper和.bg 有一个奇怪的设置
<body class="is-loading">
<div class="bg"></div>
<!-- Wrapper -->
<div id="wrapper" class="fade-in">
<!-- Intro -->
<div id="intro">
<h1 class="main-heading">Emergency Data Science</h1>
<h2 class="main-heading">Taking Advantage of the Data Flood</h2>
<p class="main-heading"><b>December 4 - 5, 2018 8:30AM - 5:00PM | Toronto</b></p>
</div>
我在这里制作了一个结果的视频。
https://www.useloom.com/share/f0c19c45ff9b421e903632157b0add64