Question

目前我有以下代码滚动到div：

button.addEventListener('click',function(){
   element.scrollIntoView();
},false);

如何让它平滑滚动？（没有jQuery，没有插件）

Answer 1

function animate(elem,time) {
    if( !elem) return;
    var to = elem.offsetTop;
    var from = window.scrollY;
    var start = new Date().getTime(),
        timer = setInterval(function() {
            var step = Math.min(1,(new Date().getTime()-start)/time);
            window.scrollTo(0,(from+step*(to-from))+1);
            if( step == 1){ clearInterval(timer);};
        },25);
        window.scrollTo(0,(from+1));
    }

var divVal = document.getElementById('yourElementID');
animate(divVal,1000);

http://jsfiddle.net/p5g4wnj9/

让我知道它是否有帮助！

Answer 2

scrollIntoView有一些选项，请尝试

.scrollIntoView（{behavior：'smooth'}）;

我发现在这个网站 “developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView” 此信息

平滑滚动到视图香草javascript

2 个答案: