Create a Scroll that goes up and down Javascript

1

Hello! I made a scroll with javascript . After clicking a button it goes up and another one goes down. But I did not like to leave 2. I would like to use a single button to go to the top and another pro end .

The Code:

 $(document).ready(function(){
  $("#scroll").click(function(){
    $('html, body').animate({scrollTop:0}, 'slow');
    });
  
    
    $("#scroll").click(function(){
      $('html, body').animate({scrollTop:$(document).height()}, 2000);
      return false;
      });
      });
    
asked by anonymous 11.12.2017 / 22:44

1 answer

1

Test like this:

$(function () {
  let botao = $('button');
  
  botao.on('click', function () {
    if ($(window).scrollTop() + $(window).height() == $(document).height()) {
      $('html, body').animate({ scrollTop: 0 }, 2000, function () {
        botao.html('Descer');
      });
    } else {
      $('html, body').animate({ scrollTop: $(document).height() - $(window).height() }, 2000, function () {
        botao.html('Subir');
      });
    }
  });
});
button
{
  position: fixed;
  right: 15px;
  bottom: 15px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><buttontype="button">Descer</button>

<!-- <br> só p/ criar a rolagem na página -->
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
    
12.12.2017 / 00:12