CODEWITHSUNDEEP
htmlcssscrollbar
Khalil Bz
Khalil Bz

Reputation: 607

How to make the scrollBar Slider of a div at the bottom by default

First of all, Look at this picture to understand what I mean by a slider: enter image description here

Problem :

Let's say I have a scrollable div with height:50% and the content is some lines so when the window is full screen I will not see a scroller like this: enter image description here

But if I will resize the browser window the scroller will be like that: enter image description here

So as you saw the scroller will automatically stay at the top, and here is my problem I want it to stay at the bottom (without JavaScript)?

I don't want to make it with JavaScript because I'm already using it in some other things on the same div like (the user have the ability to scroll app without forcing him to go down when there is an update ....), My project is a chatroom

Upvotes: 0

Views: 607

Answers (1)

Chris J
Chris J

Reputation: 1447

Contrary to what I've read above, this can easily be achieved without JS/JQ.

Create an anchor at the bottom of the DIV

<div id='thediv'>
Your content here
<a id='bottom'>here at the bottom</a>
</div>

Then link to it/call it/add it to your refresh, body onload etc...

<a href='#bottom'>Clicky</a>

Or on the previous page 

<a href='chatroom.html#bottom'>Clicky</a>

..and so on. Basic example:

https://jsfiddle.net/gguajng6/

Upvotes: 1

Related Questions