Dragpan

A jQuery plugin designed to allow click and drag panning of a scrollable element

Getting Started

Download the production version or the development version.

###Requirements

jQuery Dragpan has the following requirements:

• jQuery
• jQuery UI
  • Requires UI Core - Core and Widget

###Usage

<div id="document">
  <div id="content">
  </div>
</div>
<script src="path/to/jquery.js"></script>
<script src="path/to/dragpan.js"></script>
<script>
$(document).ready( function () {
  $("#document").dragpan();
});
</script>

###Options

Options can be parsed when Dragpan is instatiated on an element or after.

####Speed

You can adjust the speed of the drag using the speedX and speedY options.

$("element").dragpan({ speedX: 20, speedY: 20 });

The default speeds are 10, this equates to a 1:1 relationship between mouse movement and scrolling.

####Parent

You can set the parent element, this is useful if the viewport sized element is not the jquery object you are using.

$("element").dragpan({ parent: $("element").parent() });

By default this will be the element you are using the dragpan method on.

####On

You can tell dragpan to instantiate without enabling functionality using the following:

$("element").dragpan({ on: false });

This will default to true meaning if you do not specify this then the dragpan functionality will be enabled.

###Methods

You can use methods the following non-private methods:

####On

You can turn on dragpan functionality using the following on an already instantiated dragpan instance.

$("element").dragpan('on');

####Off

You can turn off the dragpan functionality using the following on an already instantiated dragpan instance.

$("element").dragpan('off');