Search This Blog

Thursday, May 9, 2019

How to scroll up the page to the bottom using jquery

Step1:

Welcome to  designer dairy blog, here we are going to discuss how to scroll down the page to the bottom using jQuery.

Step2:

Html Mark-up

<div id ="heightdiv" style=" text-align:center; font-size:34px; color:#fff; height:1000px; background-color:red;">
click the window
</div>

Step3:

The following JavaScript will scroll the page to the bottom using jQuery:

<script>

$(document).ready(function()
{
  $('#heightdiv').bind("click", function () {

         var heights = $('#heightdiv').height();

         $('html, body').animate({ scrollTop: heights },"fast");
          return false;
           });

      });
   
     </script>

Otherway hard coding scroll top value :

$('#heightdiv').bind("click", function () {

$('html, body').animate({ scrollTop:3031 },"fast");

return false;


});

Step4:

Thanks for reading my article.Stay Tune on www.webdesignersdairy.com  for more updates on Jquery.



No comments:

Post a Comment

Validating to select in sequencial order using angular

    < input type = "checkbox" (change) = "handleSelectTaskItem($event, taskItem)" [checked] = " taskItem . i...