How to keep the scroll bar of a div always down?

Asked

Viewed 1,255 times

1

I have a div that updates every 4 seconds and I use the overflow on it, I need the scrollbar to always be aligned on the last line. any suggestions?

jquery css

1 answer

2


What you need is to give the scroll the height of the div, after updating the content. Something like:

var height = el.scrollHeight;
el.scrollTop = height;

Example: https://jsfiddle.net/xtxj6orp/1/

Note: In Firefox the height of the div that will expand must be closed, for the browser to pass this div to scroll view mode. Like in the CSS of the example I put.

More reading:

  • in this example the scroll bar continues always above, however I needed it to accompany the low items being created

  • @Arsomnolasco to me the bar is always down... which browser you are using?

  • mozzila firefox, and really on Crhome is down, is there any " cat to work on ff too? I even found that it worked but only at the beginning it stays, then if another line is added remains still $(".messages"). Animate({ scrollTop: $(Document).height() }, "fast"); Return false;

  • @Interesting arsomnolasco. I think I know what it is, give me a few minutes.

  • @Arsomnolasco has a look here: https://jsfiddle.net/xtxj6orp/1/ you have to select the maximum height of the expanding element. To switch it to mode scroll when that time is reached.

  • Perfect, it worked right if you can edit your answer by inserting this detail into the mozila also thank you for helping others with the same doubts

  • @Arsomnolasco done, thank you.

Show 2 more comments

Browser other questions tagged jquery css

You are not signed in. Login or sign up in order to post.