как прокрутить сверху вниз, но не мгновенно?

Question

Прямо сейчас, Я использую

 window.scrollTo('#body')

для прокрутки до верхней части страницы, но она довольно мгновенная и выглядит странно. Итак, я хотел функцию, которая прокручивается вверх после нажатия кнопки внизу, но не мгновенно.

Answer 1

Сделал что-то похожее пару дней назад и довольно долго искал простое, но измененное решение:

Код является частью проекта .net, но так как вы пометили события javascript, я подумал, что я тоже вставлю его. Он запускается после панели обновления.

<script type="text/javascript">
// <![CDATA[
    var prm = Sys.WebForms.PageRequestManager.getInstance();

    prm.add_endRequest(resetPosition);

    function resetPosition() {
        //prm._scrollPosition.y = 0;
        //window.scrollTo(0, 0);
        //$(window).scrollTop();
        $("html, body").animate({scrollTop: 0}, 100);
    }
// ]]>
</script>

Итак, для нажатия кнопки:

$(function(){
    $("#myButton").click(function(){
        $("html, body").animate({scrollTop: 0}, 200);
    });
});

Answer 2

Использование jQuery's animate было бы самым простым способом сделать это.Но в случае, если вы хотите придерживаться чистого JS, вы можете сделать:

function scrollUp() {
  window.scrollBy(0, -10); // change this '10' as needed to control the smoothness of the scroll
  if(window.pageYOffset > 0) setTimeout(scrollUp, 10);
}

scrollUp();

Answer 3

почему вы не используете jquery

$ ('body'). Animate ({scrollTop: 0});