dragscroll

WebJar for dragscroll

License

License

MIT
GroupId

GroupId

org.webjars.bower
ArtifactId

ArtifactId

dragscroll
Last Version

Last Version

0.0.8
Release Date

Release Date

Type

Type

jar
Description

Description

dragscroll
WebJar for dragscroll
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/asvd/dragscroll

Download dragscroll

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.bower/dragscroll/ -->
<dependency>
    <groupId>org.webjars.bower</groupId>
    <artifactId>dragscroll</artifactId>
    <version>0.0.8</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.bower/dragscroll/
implementation 'org.webjars.bower:dragscroll:0.0.8'
// https://jarcasting.com/artifacts/org.webjars.bower/dragscroll/
implementation ("org.webjars.bower:dragscroll:0.0.8")
'org.webjars.bower:dragscroll:jar:0.0.8'
<dependency org="org.webjars.bower" name="dragscroll" rev="0.0.8">
  <artifact name="dragscroll" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.bower', module='dragscroll', version='0.0.8')
)
libraryDependencies += "org.webjars.bower" % "dragscroll" % "0.0.8"
[org.webjars.bower/dragscroll "0.0.8"]

Dependencies

There are no dependencies for this project. It is a standalone project that does not depend on any other jars.

Project Modules

There are no modules declared in this project.

dragscroll

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).

Usage

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

Versions

Version
0.0.8