Wie kann ich zu einem Anker-Tag navigieren, wenn der Benutzer die Seite bereits gescrollt hat?

Question

Ich habe mich umgeschaut, aber alle Antworten, die ich gefunden habe, funktionieren nur, wenn sich der Benutzer oben auf der Seite befindet - andernfalls wird der Benutzer an den falschen Ort gebracht, weil er nicht berücksichtigt, wie viel Der Benutzer hat die Seite nach unten gescrollt. Hier ist, was ich jetzt bin versucht (‚.sidebar a‘ ist ein Link zu einem Anker-Tag in der Seitenleiste ‚.Site-wrap‘ ist die scrollbaren div):

$('.sidebar a').click(function() { 
    var $url = $(this).attr('href'); 
    var $offset = $($url).offset(); //Getting the position of the anchor 
    var $currPos = $('.site-wrap').scrollTop(); //Getting the current scrolled position 
    $('.site-wrap').animate({ 
    scrollTop: $offset.top - $currPos 
    }, 1000); 
    return false; 
}); 

Ich kann nicht scheinen, herauszufinden, warum es nicht funktioniert. Ich bin ein Neuling, also ist es wahrscheinlich etwas Triviales, aber ich würde alle Hinweise in die richtige Richtung schätzen.

Answer 1

Wenn ich mich nicht irre, möchten Sie nur die Position Ihres Elements scrollen, unabhängig von der aktuellen Bildlaufposition.

So soll es aus der Gleichung, um die aktuelle Bildlaufposition zu ergreifen enought und jQuery .position Funktion anstelle von .Offset:

$('.sidebar a').click(function() { 
    var $url = $(this).attr('href'); 
    var $offset = $($url).position(); //Getting the position of the anchor 
    $('.site-wrap').animate({ 
    scrollTop: $offset.top 
    }, 1000); 
    return false; 
}); 

Dies funktioniert, wenn das aktuelle Element a direktes Kind von .site-wrap.