CSS - 视差图像不起作用

时间:2015-08-07 15:32:54

标签: html css

我在这里有整个部分:

<section id="design-centre">
    <section id="design-centre-cover">
        <div class="container">
            <div class="row">
                <div class="cover-left">
                    <h1>Our Designs Make Luxury More Affordable</h1>
                </div>
            </div>
        </div>
    </section>
 </section>

这是CSS:

 section#design-centre {
    position: relative;
 }

 background: url(../images/design-center-cover.jpg) center top no-repeat;
    height: 800px;
    background-attachment: fixed;
 }

我要做的是以下内容:

当用户滚动时,让图像滚动,这是我正在寻找的示例:

http://www.hush.ca/hush-design-main/#hush-design

我尝试使用background-attachment: fixed;,但这根本不起作用

1 个答案:

答案 0 :(得分:0)

目前,没有JavaScript,它似乎无法实现。请尝试使用some tutorials代码。主要前提是使用vanilla JavaScript window.onscroll或jQuery $(window).scroll()事件处理程序来检测主页的滚动,并相应地重新定位背景。

此外,下次您可能需要先search SO提出重复/类似问题,然后再提出自己的问题。