Go to the bottom of this page

Question

Go to the bottom of this page

Navigation

#1 by (4 votes)

3

Hello, I wanted to know how to do when the person clicks, it will go to the bottom of the page. If you can teach me, I thank you !! In case it was when you clicked on any of these texts, link

javascript jquery

asked by anonymous 27.07.2016 / 16:24

1 answer

How to list the highest salary among all employee functions? Get an array in JAVA

score 4 · Accepted Answer

To scroll to the bottom of the page:

$('#down').on('click', function() {
  $('html, body').animate({
    scrollTop: $(document).height()
  }, 700);
});

#div1 {
 height: 1000px;
 background-color: red;
}
#div2 {
  height: 200px;
  background-color: blue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="div1">
  <button id="down">IR LÁ PARA BAIXO</button>
</div>
<div id="div2"></div>

To scroll to a certain element:

var ele = $('#div2');
$('#down').on('click', function() {
  $('html, body').animate({
    scrollTop: ele.offset().top
  }, 700);
});

#div1 {
 height: 1000px;
 background-color: red;
}
#div2 {
  height: 800px;
  background-color: blue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="div1">
  <button id="down">IR PARA DIV2</button>
</div>
<div id="div2"></div>

NOTE that in a real project in principle it is not necessary to put height in the divs, because the height of these must be defined by their content