Scrolling la fenêtre avec jquery ne parvient pas à animer lorsqu'elle est déclenchée par un hashchange dans Backbone

Question

J'ai une fonction qui ressemble essentiellement à ceci:

function scroll(scrollTop) { 
    $("body,html").animate({scrollTop: scrollTop}); 
} 

et dans les voies Backbone, je suis en train d'utiliser cette fonction pour faire défiler à une position sur une page, de nouveau, simplifié:

var Router = Backbone.Router.extend({ 
    routes: { 
    "": "index", 
    "foo": "foo" 
    }, 

    index: function() { 
    scroll(0); 
    }, 

    foo: function() { 
    scroll($("#foo").offset().top); 
    } 
}); 

Cela fonctionne bien sur la charge de la page (si le chargement «/foo »), en appelant la fonction manuellement ou en utilisant pushState (par opposition au fragment de hachage) des itinéraires .

Mais en utilisant les voies de fragments de hachage, l'animation échoue. La position du défilement change toujours, mais instantanément, sans animation.

est-il une solution pour cela?

Answer 1

Ce que vous décrivez est en fait le comportement du navigateur lors du changement du hashtag. Autrement dit, la navigation domain.com-domain.com#someId est comme demander au navigateur de « se concentrer » sur l'élément de la page qui est id someId. Donc, la fenêtre va se déplacer vers cet élément. Malheureusement, je ne connais pas de solution à ce problème.

Vous pouvez regarder cette discussion, j'ai trouvé lors de la recherche d'une solution possible: Modifying document.location.hash without page scrolling.