Let's add top and bottom buttons to our scrollbars so our scrollbars look and behave more like native scrollbars.
Let's go back to that line of code in our
scripts.js
file where we called thejScrollPane()
method to create the custom scrollbars:$('#scrolling').jScrollPane();
Remember how we could pass things to methods and functions by putting them inside the parentheses? We had the following example:
dog.eat('bacon');
where we wanted to say that the dog was eating bacon. So, in JavaScript-speak we passed bacon to the eat method of the dog.
Well, in this case, we can pass a set of options to the
jScrollPane
method to control how our scrollbars look and act. We want to show the top and bottom arrows on our scrollbars, and we can do that by setting theshowArrows
option totrue
. We just have to make a simple modification to our line of code as follows:$('#scrolling').jScrollPane({showArrows:true});
Now when you refresh the page, you'll see boxes at the...