小编sai*_*aid的帖子

使用纯css视差的Jquery滚动不起作用

我正在尝试使用着名的Kess Clark纯css视差页面教程(http://blog.keithclark.co.uk/pure-css-parallax-websites/).

到现在为止还挺好.当我想将它与带有jQuery平滑滚动的导航栏组合时,问题就来了.

页面已滚动时会出现此问题.所以基本上,它从顶部滚动到我希望它滚动的点,但如果页面在产品或联系人上,它会滚动到奇怪的地方.

我为此尝试了一堆不同的片段,但似乎它只是不想工作!

HTML

导航:

<ul class="nav navbar-nav navbar-right">
    <li><a href="#group2">Home</a></li>
    <li><a href="#group3">About</a></li>
    <li><a href="#group5">Products</a></li>
    <li><a href="#group7">Contact</a></li>
</ul>
Run Code Online (Sandbox Code Playgroud)

身体:

<div class="parallax">
    <div id="group2" class="parallax__group">
        <div class="parallax__layer parallax__layer--back">
            <div class="title">START</div>
        </div>
    </div>
    <div id="group3" class="parallax__group">
        <div class="parallax__layer parallax__layer--base">
            <div class="title">ABOUT</div>
        </div>
    </div>
    <div id="group4" class="parallax__group">
        <div class="parallax__layer parallax__layer--deep">
            <div class="title">RANDOM PICTURE</div>
        </div>
    </div>
    <div id="group5" class="parallax__group">
        <div class="parallax__layer parallax__layer--base">
            <div class="title">PRODUCTS</div>
        </div>
    </div>
    <div id="group6" class="parallax__group">
        <div class="parallax__layer parallax__layer--back">
            <div class="title">RANDOM PICTURE</div>
        </div>
   </div>
   <div id="group7" class="parallax__group"> …
Run Code Online (Sandbox Code Playgroud)

html javascript css jquery

5
推荐指数
1
解决办法
1095
查看次数

标签 统计

css ×1

html ×1

javascript ×1

jquery ×1