jQuery ändern Geschwindigkeit abhängig von der Entfernung

Question

Ich versuche, eine relativ konstante Geschwindigkeit beim Zurückblättern an den Anfang des Browser-Fensters zu halten, je nachdem, wie weit vom oberen Rand der Seite Sie sind.

Also, wenn Sie die Seite 500px oder 5000px hinuntergescrollt haben, möchte ich eine Funktion erstellen, die berechnet, wie lange es dauert, um wieder nach oben zu animieren, wobei eine konstante Geschwindigkeit beibehalten wird.

var scrollTo = function() { 
    var top = $(window).scrollTop(); 
    var dist = $('.article').offset().top; 
    var speed = // not sure what goes here depending on distance 

    $('html, body').animate({scrollTop: dist}, speed, 'linear'); 
}; 

Answer 1

Sie so etwas wie distance * <millisecond per unit distance> verwenden können,

Wie, wenn Sie Abstand von 500 und 1500 in 1000 ms und 3000 ms abdecken wollen jeweils dann wird die Formel

var speed = distance * 2 

Ex sein:

var scrollTo = function() { 
 

 
    var dist = jQuery(window).scrollTop(); 
 
    var speed = dist * 2; 
 

 
    $('html, body').animate({ 
 
    scrollTop: 0 
 
    }, speed); 
 
}

body { 
 
    height: 5000px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a style="position:fixed; top: 10px" onclick="scrollTo()">top</a>