scroll to bottom on page load but will allow to scroll on top
Question
I would like to scroll The div bottom to the bottom of the page when page loads but will also like to scroll back up when needed to how can i archive this without any animations how can i achieve this echo "<div id='bottom'><p><b>$from_username</b><br />$message</p></div>";
<script>
function scrollpage() {
function f()
{
window.scrollTo(0,i);
if(status==0) {
i=i+40;
if(i>=Height){ status=1; }
}
setTimeout( f, 0.01 );
}f();
}
var Height=document.documentElement.scrollHeight;
var i=1,j=Height,status=0;
scrollpage();
</script>
this is what i have so far, i am able to scroll down automatically but can not scroll up when i want to, what can i do if i want to scroll up ?
1 answers
solution1
2 ACCPTED 2015-11-29 03:05:41
Scroll to bottom of Div on page load (jQuery) this is where I found the code I needed to put this together for you.
<script>
$( document ).ready(function() {
var d = $('#div1');
d.scrollTop(d.prop("scrollHeight"));
console.log("at the bottom!");
});
</script>
</head>
<body>
<p>top</p>
<div style="max-height: 200px;">
<div id='div1' style='background-color:grey;width:200px;overflow:scroll;overflow-x:hidden;max-height:200px;'>
<p>some text</p><p>some text</p><p>some text</p><p>some text</p><p>some text</p><p>some text</p><p>some text</p><p>some text</p><p>some text</p><p>some text</p><p>some text</p><p>some text</p></div>
</div>
<p>bottom</p>
<p>text under the div</p>
</body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.