jQuery scrollTop ne fonctionne pas en chrome mais fonctionne dans Firefox

Question

J'ai utilisé une fonction scrollTop dans JQuery pour naviguer vers le haut. Mais étrangement, «le défilement animé lisse» a cessé de fonctionner dans Safari et Chrome (défilement sans animation fluide) après quelques modifications. Mais cela fonctionne bien dans Firefox. Quel pourrait être le problème? Voici la fonction jquery que j’ai utilisée,

jQuery

 $('a#gotop').click(function() {
  $("html").animate({ scrollTop: 0 }, "slow");
  //alert('Animation complete.');
  //return false;
});
 

HTML

 <a id="gotop" href="#">Go Top </a>
 

CSS

 #gotop {        Cursor: pointer;
                position: relative;
                float:right;
                right:20px;
                /*top:0px;*/
    }
 

Answer 1

Essayez d'utiliser $("html,body").animate({ scrollTop: 0 }, "slow");

Cela fonctionne pour moi en chrome.

Answer 2

Cela fonctionne dans les deux navigateurs si vous utilisez scrollTop () avec 'document':

 $(document).scrollTop();
 

... au lieu de 'html' ou 'body'. Autrement, cela ne fonctionnera pas en même temps dans les deux navigateurs.

Answer 3

J'ai utilisé cela avec succès dans Chrome, Firefox et Safari. Je n'ai pas encore pu le tester dans IE.

 if($(document).scrollTop() !=0){
$( 'html, body' ).animate( { scrollTop: 0 }, 'fast' );
}
 

La raison de l'instruction "if" est de vérifier si l'utilisateur est tout prêt en haut du site. Si c'est le cas, ne faites pas l'animation. De cette façon, nous n'avons pas à nous préoccuper autant des résolutions d'écran.

La raison pour laquelle j'utilise $ (document) .scrollTop au lieu de ie. $ ('html, body') est la cause pour laquelle Chrome renvoie 0 pour une raison quelconque.

J'espère que ça aide :)

Answer 4

J'utilise:

 var $scrollEl = $.browser.mozilla ? $('html') : $('body');
 

car lire jQuery scrollTop ne fonctionnant pas en chrome mais fonctionnant dans Firefox

Answer 5

peut-être que vous voulez dire top: 0

 $('a#gotop').click(function() {
  $("html").animate({ top: 0 }, "slow", function() { 
                                           alert('Animation complete.'); });
  //return false;
});
 

depuis des documents animés

.animate ( propriétés , [durée], [assouplissement], [rappel])
properties Une carte des propriétés CSS vers lesquelles l'animation se déplacera.
...

ou $(window).scrollTop() ?

 $('a#gotop').click(function() {
  $("html").animate({ top: $(window).scrollTop() }, "slow", function() { 
                                                              alert('Animation complete.'); });
  //return false;
});