Free Trial

Safari Books Online is a digital library providing on-demand subscription access to thousands of learning resources.

  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

4. Building Custom Scrollbars > Time for action – adding up and down arrows

Time for action – adding up and down arrows

Let's add top and bottom buttons to our scrollbars so our scrollbars look and behave more like native scrollbars.

  1. Let's go back to that line of code in our scripts.js file where we called the jScrollPane() 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 the showArrows option to true. We just have to make a simple modification to our line of code as follows:

    $('#scrolling').jScrollPane({showArrows:true});

  

You are currently reading a PREVIEW of this book.

                                                                                                                    

Get instant access to over $1 million worth of books and videos.

  

Start a Free 10-Day Trial


  
  • Safari Books Online
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint