平滑不仅仅是引导程序中的视差滚动

时间:2013-10-12 06:15:10

标签: css twitter-bootstrap scroll parallax smooth

我想我已经想出如何在http://mode87.com/untame/demo/parallax/的帮助下使用引导程序实现视差滚动,但我无法弄清楚如何在引导程序中进行平滑滚动,就像在SMINT中完成的那样:{{3} - 我怎么能在bootstrap中做到这一点?到目前为止,我有这个:http://www.outyear.co.uk/smint/demo/

谢谢!

1 个答案:

答案 0 :(得分:4)

<强> See the Demo here

HTML

<ul>
    <li><a href="#one">Menu</a></li>
    <li><a href="#two">Menu</a></li>
    <li><a href="#three">Menu</a></li>
</ul>
<div id="one">
    Section one
</div>
<div id="two">
    Section two
</div>
<div id="three">
    section three
</div>

CSS

#one {
    height: 400px;
}
#two {
    height: 400px;
}
#three {
    height: 400px;
}

JS

$('a').click(function(){
    $('html, body').animate({
        scrollTop: $( $.attr(this, 'href') ).offset().top
    }, 500);
    return false;
});