tiny library for drag-n-drop scrolling style
Filed under user interfaceShow All
$ bower install dragscroll
$ npm install dragscroll
dragscroll.jsin a preferable way (that is an UMD module):
dragscrollclass to a scrollable element:
<div class=dragscroll> Big text goes here... </div>
That's it! Now you can scroll it by dragging. You can also add the
dragscrollclass to the
<body>element and drag the whole page.
Keep in mind that now it is not possible to select the content with mouse, so apply the
cursor: default;CSS style to prevent confusing the users (or even
cursor: grab;in case the content is not a text).
If you add or remove the
dragscrollclass dynamically, invoke
dragscroll.reset()to update the listeners.
You can also add the
nochilddragattribute to a scrollable element, which will only enable drag-scrolling for an element itself, but not for its subchildren. This can be usefull, if you want to enable the scrolling the area by dragging its empty space, but keep the opportunity to select the text (see example).
Follow me on twitter: https://twitter.com/asvd0