Step1:
Welcome to designerdairy 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 readingm y article .Stay Tune on www.webdesignersdairy.com for more updates on Jquery.
Welcome to designer
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
No comments:
Post a Comment