Skip to content

Latest commit

 

History

History
97 lines (78 loc) · 2.46 KB

README.md

File metadata and controls

97 lines (78 loc) · 2.46 KB

Draggable Background

A jQuery plugin to make background images draggable.

Configuration

Option Type Known Values Default Value Description
bound Boolean true|false true Whether dragging is bounded by the edges of the image.
axis String x|y If specified, restrict dragging along x or y axis.
units String pixels|percent pixels If the plugin should set the background position using pixels or percentages. Percentages are useful if your image area is responsive and may change size but retain the aspect ratio.
done Function Called when dragging is stopped by mouseup, touchup, or mouseleave.

Usage

// default options
$('div').backgroundDraggable();

// only draggable in the x direction, and dragging is not bounded by the image
$('div').backgroundDraggable({ bound: false, axis: 'x' });

// disable draggable background
$('div').backgroundDraggable('disable');

// callback when drag complete
$('div').backgroundDraggable({
  done: function() {
    backgroundPosition = $('div').css('background-position');
    console.log(backgroundPosition);
  }
});

Demo

http://kentor.github.com/jquery-draggable-background/

Support

IE9+. Only background-size value of auto (default) and cover are supported. background-position must be absolute pixels. There will be bugs if you use center for percentages.

Changelog

v1.2.3 [2014-10-17]

  • Fixed child elements of element with background dragging calling preventDefault (7f17318).
  • Improved behavior of dragging, especially when mouse up happens outside the window (d1fdbe4).

v1.2.2 [2014-09-01]

  • Added support for a callback when dragging is finished.

v1.2.1 [2014-08-01]

  • Added support for disabling plugin

v1.2 [2014-06-06]

  • Refactored code to use semicolons.
  • Support for background-size: cover.

v1.1 [2013-05-19]

  • Touch support.

v1.0 [2012-09-23]

  • Initial release.

License

Copyright (c) 2014 Kenneth Chung

Licensed under the MIT license.