how to scroll the content inside of a fixed-height container?
Question by bobighorus
I was wondering how I can realize with jQuery the simple example in the following image.
Basically it’s a fixed-heigt container div and I wish to make the content inside of it (a list of paragraph) scrollable up/down by arrows.
I need arrows commands and no scrollbars and I wish to not use any plugin (if it’s possible), like this old dhtml example.
Consider that I don’t know the exactly height of the entire content, because it’s ajax loaded and so it can be variable.
Any help will be strongly appreciated.
Thanks in advance.
Answer by Starx
You are probably looking for scrollTo Plugin. But, If you want to bring native HTML scroll bars, then defining a overflow property, does the job for you.
div { overflow-y: scroll }
Updates
I made a very simple demo of how the scroller can be create with just simple jQuery.
Another demo, with the scroll limits. Perfect to be called a plugin on the making.
Update 2
What you are looking for is click and hold event, which is not available but, we can use mousedown
event to build a workaround.
Check a udpated demo
Basically, the idea is to start a interval on mousedown and clear on mouseup