Scrollable container moves on button click


I was wondering how I may go about making a scrollable container move along its horizontal axis based on the click of a button rather than having it scroll automatically when within the container area?

Here is the prototype I am currently playing around with


What I would like to happen is on mouse over the left and right buttons (In this case the yellow blocks) would appear and on click of those buttons the scrollable area would move left and right depending on which button you clicked.

As you can see there are a number of rows and when trying to scroll down the page when the cursor enters the scrollable container it automatically moves along the horizontal access which makes it very difficult to scroll down the rest of the page. I have tried setting the container to be draggable only but I still cant seem to get the button click events to work correctly.

Any help anybody could provide on this would be most welcome!



Please sign in to leave a comment.