For example I have I a div tag with the scroll bar on the right of the div tag.
I want to show the div with the last line, so I have this:
document.getElementById("divscroll").scrollTop = 250000;
I can make it scroll to the end in Firefox but never succcess with IE event with the bigger number!
Is there any simple Cross-borwser script (not JQuery or any big framework!)
scrollTop property gets or sets the number of pixels that an element's content is scrolled vertically. An element's scrollTop value is a measurement of the distance from the element's top to its topmost visible content. When an element's content does not generate a vertical scrollbar, then its scrollTop value is 0 .
The scrollTop() method sets or returns the vertical scrollbar position for the selected elements. Tip: When the scrollbar is on the top, the position is 0. When used to return the position: This method returns the vertical position of the scrollbar for the FIRST matched element.
If your CSS html element has the following overflow markup, scrollTop will not function. To allow scrollTop to scroll, modify your markup remove overflow markup from the html element and append to a body element.
scrollTop
works in all major browsers.
To scroll to the bottom of the element:
var div = document.getElementById('divscroll');
div.scrollTop = div.scrollHeight - div.clientHeight;
clientHeight
also works across browsers, and scrollHeight
mostly works.
Make sure that overflow property is set:
<div id="divscroll" style="height: 100px; width: 100px; overflow: scroll;">
//// something something
</div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With