dragscroll
Advanced tools
Readme
Dragscroll is a micro JavaScript library (910 bytes minified) which enables scrolling via holding the mouse button ("drag and drop" or "click and hold" style, online demo). It has no dependencies and is written in vanilla JavaScript (which means it works anywhere).
Download the and unpack distribution, or install it using Bower:
$ bower install dragscroll
or npm:
$ npm install dragscroll
Load the dragscroll.js in a preferable way (that is an UMD module):
<script src="path/to/dragscroll.js"></script>
Add the dragscroll class 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
dragscroll class 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 dragscroll class dynamically, invoke
dragscroll.reset() to update the listeners.
You can also add the nochilddrag attribute 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
FAQs
Tiny library for drag-n-drop scrolling style
The npm package dragscroll receives a total of 6,225 weekly downloads. As such, dragscroll popularity was classified as popular.
We found that dragscroll demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.