An application that I’ve been working on recently makes heavy use of the jQuery UI library, particularly the draggable, sortable, and droppable modules. Users need to be able to sort a list of locations by dragging them within a fairly confined space. Since the area containing the list items has a fixed size, scrollbars appear when the list exceeds the bounds of the pane.

Normally, $.draggable( { scroll: true } ); is enough to get jQuery UI to work with the native browser scrollbars. For this particular project, the design called for custom scrollbars, which led me to Kelvin Luck’s jScrollPane jQuery plugin. Unfortunately, while jScrollPane allows us to style scrollbars however we wish, they doesn’t behave exactly like those native to the browser.

Continue reading→