额外平滑滚动到div id jQuery - 慢启动,快速中间和慢速结束

时间:2016-06-27 19:56:39

标签: jquery css scroll

如何在滚动事件期间更改滚动速度?

我的想法是让滚动事件开始变慢,在中间部分加速并慢慢向下关闭目标。对鼠标滚轮事件有不同的尝试,例如。来自Nathan Rutzky

我认为它适用于animate()的时间变量,但我需要提示如何实现它......

$(".button").click(function() {
    $('html, body').animate({
        scrollTop: $($(this).attr('data-menuanchor')).offset().top
    }, 1000);
});
#div {
    min-height:1100px;
    background-color: #ff0000;
    background-image: linear-gradient(to bottom, #ff0000, #ff8f8f); 
}
#myDiv {
    height:100px;
    background-color: blue;
}
.button {
    position: fixed;
    top: 0;
    background: #fff;
}
.button:nth-of-type(1){
    left: 100px; 
}  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="button" data-menuanchor="#myDiv">button down</div>
<div class="button" data-menuanchor="#div">button up</div>
<div id="div">
    <p>Content</p>        
</div>
<div id="myDiv"></div>

0 个答案:

没有答案