I'm using jScrollPane pretty much out of the box with the following changes:
I put the scripts into assets/scripts, the css into assets/css, and the images into assets/images. Any urls have been changed to reflect this. I created three jpgs for the up arrow, down arrow (10 x 9 px) and the drag grab center (10 x 10 px) The problem I am having is that the content doesn't scroll down enough to display all the content of the div. In the sample div, it's the anchor a the bottom that's not showing up. Here's the call: <-- $('.scrollPane').jScrollPane({showArrows:true, scrollbarWidth: 10}); --> Here's a sample div: <-- <div class="scrollPane"> <h2>NEWS</h2> <p>Brulant S.W.A.T (Strategic Web and Technology) Event</p> <a href="#">View All News</a> </div> --> and here is the pertinent css: <-- .jScrollPaneDrag { position: absolute; height: 10px; background: url(../images/drag_grab.jpg) no-repeat 0 0; cursor: pointer; overflow: hidden; } a.jScrollArrowUp { display: block; position: absolute; z-index: 1; top: 0; right: 0; text-indent: -2000px; overflow: hidden; /*background-color: #666;*/ height: 9px; background: url(../images/up_arrow.jpg) no-repeat 0 0; } a.jScrollArrowDown { display: block; position: absolute; z-index: 1; bottom: 0; right: 0; text-indent: -2000px; overflow: hidden; /*background-color: #666;*/ height: 9px; background: url(../images/down_arrow.jpg) no-repeat 0 0; } .scrollPane { width: 175px; overflow: auto; height: 50px; margin:10px 0 15px 0; } .scrollPane a:link, .scrollPane a:hover, .scrollPane a:visited, #centerRightCol a:link, #centerRightCol a:hover, #centerRightCol a:visited{ color:#b7c71c; height:7px; padding-right: 10px; background-image:url(../images/right_arrow.jpg); background-repeat:no-repeat; background-position:right; } -->