Using JQuery or Javascript, how can I tie a click function to control the scroll of an element/div?

Question

Using JQuery or Javascript, how can I tie a click function to control the scroll of an element/div? I want to add buttons to control the vertical scroll of a div without changing positioning or margins? Thank You in advance!

Right now i have the scrollbars hidden and I can only scroll by using the mousewheel, I need to add another functionality in case the user is on mobile or doesn't have a scroll wheel on their mouse.

Answer 1

$(".up-button").on('click', function () {
   $("#containing-div").animate({scrollTop: '-=20px'});
});

For .down-button you would use +=20px

http://jsfiddle.net/Yyw7Z/

Answer 2

看看jQuery api，他们有scrollTop()