how to fix jquery scroll top animation?

58
February 17, 2019, at 3:30 PM

this code is working it will get me back from bottom to top but what it does not animate. anyone can help me on this?

$('.topScroll').click(function(){
        $("html, body").animate({scrollTop : "0px"},"fast");
});
Answer 1

OK since seems like you're still in problems. The code you posted - works. Well, since you did not shared any HTML I can only suppose your exact markup and environment.

  • Place jQuery and your code right before the closing body tag.
  • If needed use Event.preventDefault()

Working example:

<!DOCTYPE html> 
<html> 
 
<head> 
  <meta charset="utf-8"> 
  <meta name="viewport" content="width=device-width"> 
  <title>topScroll - example</title> 
  <style> 
    body { height: 300vh; } 
    .topScroll { position: absolute; top: 200vh;} 
  </style> 
</head> 
 
<body> 
 
  <header id="top"> 
    <h1>Scroll down...</h1> 
  </header> 
  <a href="#top" class="topScroll">GO TO TOP</a> 
 
 
  <script src="//code.jquery.com/jquery-3.1.0.js"></script> 
  <script> 
    $(document).on('click', '.topScroll', function(ev) { 
      ev.preventDefault(); // Prevent browser doing default stuff on anchor/button click 
      $("html, body").animate({scrollTop: "0px"}, 500); 
    }); 
  </script> 
   
</body> 
</html>

Answer 2

You can try by slowing down the animation using microseconds as follows:

$("html, body").animate({scrollTop : "0px"},1200);
READ ALSO
Firebase Cloud Functions async function

Firebase Cloud Functions async function

I need some help with async function with firebase and nodejs

47
Writing a new line to JSON file using NodeJS

Writing a new line to JSON file using NodeJS

I have a JSON file, and I want to add a single entry to this JSON file using NodeJS

63
Sorting tree array infinite and generating a nested HTML structure using good practices

Sorting tree array infinite and generating a nested HTML structure using good practices

I want to create this question with the intention that we can collect in one place, one or several examples of an infinite array tree, and generate a nested structure of HTML <ul> <li>, with examples of codes using good practices for junior...

20
When does Pandas default to broadcasting Series and Dataframes?

When does Pandas default to broadcasting Series and Dataframes?

I came across something curious (to me) while trying to answer this question

63