0

我正在尝试在我的网站中实现平滑滚动，但无法使用任何可用的 jquery 插件，因为我不太熟悉 javascript。在这方面的任何帮助都会有所帮助。这是相关代码：`

<div class="container-fluid" id="navigation">
    <div class="row-fluid">
        <div class="span2 ">
            <div class=" sidebar-nav sidebar-nav-fixed">
                <h4><a href="#about"  class="nav1 transition">About</a></h4>
                <h4><a href="#ourservices"  class="nav2 transition">Our Services</a></h4>
                <h4><a href="#awards"  class="nav3 transition">Awards</a></h4>
            </div>
        </div>

        <div class = "span10" style="margin-top:30px">
            <div class="hero-unit " >                                
                <div id="about" >
                    <h1 >About </h1>                                
                    <hr>
                    <p align="justify">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
                proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </p>
                </div>
                <div id="ourservices" >
                    <h1 >Our Services</h1>                                
                    <hr>
                    <p align="justify">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
                proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                </div>
                <div id="awards" >
                    <h1 >Awards</h1>                                
                    <hr>
                    <p align="justify">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
                proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                </div>
            </div>
        </div>
    </div>
</div>

我的意图是显示在“关于”部分......当用户点击说服务时......英雄单元滚动到“服务”部分。由于我对javascript不太熟悉，因此将不胜感激。非常感谢。

4

1 回答 1

0

你可以使用jquery的iscroll插件... Iscroll

我在 5 月的移动网站中使用过这个：smooth-scroll

转到年份选择页面..有一个平滑的滚动实现。

于 2013-07-10T07:00:16.793 回答