Jak wyłączyć skok kotwicy podczas ładowania strony

Question

Podczas odwiedzania my_site.com/page.php#something pozycja przewijania jest położeniem przenoszącym ten konkretny hashtag, a nie górną krawędzią strony.

Wykonanie window.scrollTo(0, 0); nie zmienia tego faktu. Co wtedy może?

EDYCJA: próbowano również zaakceptowaną odpowiedź od How to disable anchor "jump" when loading a page?. Nie wydaje się już działać.

Answer 1

Mając ten kod HTML:

<a href="#test">link</a> 
<div id="test"></div> 

można uniknąć przewijania do elementu div i zamiast przewijania do góry okna za pomocą tego kodu:

$("a").on("click", function(e) { 
    e.preventDefault(); 
    window.scrollTo(0, 0); 
}); 

EDIT:

Możesz spróbować dodać to:

var firstVisit = true; 
$(window).scroll(function() { 
    if (firstVisit) { 
     window.scrollTo(0, 0); 
     firstVisit = false; 
    } 
}); 

Answer 2

Co musisz zrobić, to przechowywać hashtag do późniejszego wykorzystania, a następnie usunąć, aby przeglądarka nie miała niczego do przewijania.

Ważne jest, aby nie umieszczać tej części kodu w funkcjach $() lub $ (window) .load(), ponieważ byłoby za późno, a przeglądarka już przeniosła się do znacznika.

// store the hash (DON'T put this code inside the $() function, it has to be executed 
// right away before the browser can start scrolling! 
var target = window.location.hash, 
    target = target.replace('#', ''); 

// delete hash so the page won't scroll to it 
window.location.hash = ""; 

// now whenever you are ready do whatever you want 
// (in this case I use jQuery to scroll to the tag after the page has loaded) 
$(window).load(function() { 
    if (target) { 
     $('html, body').animate({ 
      scrollTop: $("#" + target).offset().top 
     }, 700, 'swing', function() {}); 
    } 
});