jQuery UI Draggable - Constrain movement

From 06b3f727378323089ee56a24999dd97c87887cc0 Mon Sep 17 00:00:00 2001 From: yvesf Date: Fri, 26 Nov 2010 18:44:25 +0100 Subject: change jquery theme, rm development stuff --- .../demos/draggable/constrain-movement.html | 69 ------------------- .../demos/draggable/cursor-style.html | 49 -------------- .../demos/draggable/default.html | 39 ----------- .../demos/draggable/delay-start.html | 45 ------------- .../development-bundle/demos/draggable/events.html | 77 ---------------------- .../development-bundle/demos/draggable/handle.html | 50 -------------- .../development-bundle/demos/draggable/index.html | 28 -------- .../development-bundle/demos/draggable/revert.html | 44 ------------- .../development-bundle/demos/draggable/scroll.html | 51 -------------- .../demos/draggable/snap-to.html | 68 ------------------- .../demos/draggable/sortable.html | 57 ---------------- .../demos/draggable/visual-feedback.html | 77 ---------------------- 12 files changed, 654 deletions(-) delete mode 100644 static/development-bundle/demos/draggable/constrain-movement.html delete mode 100644 static/development-bundle/demos/draggable/cursor-style.html delete mode 100644 static/development-bundle/demos/draggable/default.html delete mode 100644 static/development-bundle/demos/draggable/delay-start.html delete mode 100644 static/development-bundle/demos/draggable/events.html delete mode 100644 static/development-bundle/demos/draggable/handle.html delete mode 100644 static/development-bundle/demos/draggable/index.html delete mode 100644 static/development-bundle/demos/draggable/revert.html delete mode 100644 static/development-bundle/demos/draggable/scroll.html delete mode 100644 static/development-bundle/demos/draggable/snap-to.html delete mode 100644 static/development-bundle/demos/draggable/sortable.html delete mode 100644 static/development-bundle/demos/draggable/visual-feedback.html (limited to 'static/development-bundle/demos/draggable') diff --git a/static/development-bundle/demos/draggable/constrain-movement.html b/static/development-bundle/demos/draggable/constrain-movement.html deleted file mode 100644 index 33de2aa..0000000 --- a/static/development-bundle/demos/draggable/constrain-movement.html +++ /dev/null @@ -1,69 +0,0 @@ - - - - - jQuery UI Draggable - Constrain movement - - - - - - - - - - - - -

- -

Constrain movement along an axis:

- -

I can be dragged only vertically

- -

I can be dragged only horizontally

- -

Or to within another DOM element:

I'm contained within the box

- -

I'm contained within the box's parent

- -

I'm contained within my parent

- -

- - - -

Constrain the movement of each draggable by defining the boundaries of the draggable area. Set the axis option to limit the draggable's path to the x- or y-axis, or use the containment option to specify a parent DOM element or a jQuery selector, like 'document.'

- - - diff --git a/static/development-bundle/demos/draggable/cursor-style.html b/static/development-bundle/demos/draggable/cursor-style.html deleted file mode 100644 index 1626076..0000000 --- a/static/development-bundle/demos/draggable/cursor-style.html +++ /dev/null @@ -1,49 +0,0 @@ - - - - - jQuery UI Draggable - Cursor style - - - - - - - - - - - - -

- -

I will always stick to the center (relative to the mouse)

- -

My cursor is at left -5 and top -5

- -

My cursor position is only controlled for the 'bottom' value

- -

- - - -

Position the cursor while dragging the object. By default the cursor appears in the center of the dragged object; use the cursorAt option to specify another location relative to the draggable (specify a pixel value from the top, right, bottom, and/or left). Customize the cursor's appearance by supplying the cursor option with a valid CSS cursor value: default, move, pointer, crosshair, etc.

- - - diff --git a/static/development-bundle/demos/draggable/default.html b/static/development-bundle/demos/draggable/default.html deleted file mode 100644 index 9221183..0000000 --- a/static/development-bundle/demos/draggable/default.html +++ /dev/null @@ -1,39 +0,0 @@ - - - - - jQuery UI Draggable - Default functionality - - - - - - - - - - - - -

- -

Drag me around

- -

- - - -

Enable draggable functionality on any DOM element. Move the draggable object by clicking on it with the mouse and dragging it anywhere within the viewport.

- - - diff --git a/static/development-bundle/demos/draggable/delay-start.html b/static/development-bundle/demos/draggable/delay-start.html deleted file mode 100644 index dcaff52..0000000 --- a/static/development-bundle/demos/draggable/delay-start.html +++ /dev/null @@ -1,45 +0,0 @@ - - - - - jQuery UI Draggable - Delay start - - - - - - - - - - - - -

- -

Only if you drag me by 20 pixels, the dragging will start

- -

Regardless of the distance, you have to drag and wait for 1000ms before dragging starts

- -

- - - -

Delay the start of dragging for a number of milliseconds with the delay option; prevent dragging until the cursor is held down and dragged a specifed number of pixels with the distance option.

- - - diff --git a/static/development-bundle/demos/draggable/events.html b/static/development-bundle/demos/draggable/events.html deleted file mode 100644 index 93f2ea5..0000000 --- a/static/development-bundle/demos/draggable/events.html +++ /dev/null @@ -1,77 +0,0 @@ - - - - - jQuery UI Draggable - Events - - - - - - - - - - - - -

- -

Drag me to trigger the chain of events.

- -

"start" invoked 0x
"drag" invoked 0x
"stop" invoked 0x

- -

- - - -

Layer functionality onto the draggable using the start, drag, and stop events. Start is fired at the start of the drag; drag during the drag; and stop when dragging stops.

- - - diff --git a/static/development-bundle/demos/draggable/handle.html b/static/development-bundle/demos/draggable/handle.html deleted file mode 100644 index bbde971..0000000 --- a/static/development-bundle/demos/draggable/handle.html +++ /dev/null @@ -1,50 +0,0 @@ - - - - - jQuery UI Draggable - Handles - - - - - - - - - - - - -

- -

I can be dragged only by this handle

- -

You can drag me around…

…but you can't drag me by this handle.

- - - -

Allow dragging only when the cursor is over a specific part of the draggable. Use the handle option to specify the jQuery selector of an element (or group of elements) used to drag the object.

Or prevent dragging when the cursor is over a specific element (or group of elements) within the draggable. Use the cancel option to specify a jQuery selector over which to "cancel" draggable functionality.

- - - diff --git a/static/development-bundle/demos/draggable/index.html b/static/development-bundle/demos/draggable/index.html deleted file mode 100644 index 0beda8e..0000000 --- a/static/development-bundle/demos/draggable/index.html +++ /dev/null @@ -1,28 +0,0 @@ - - - - - jQuery UI Draggable Demos - - - - -

Examples

- - - diff --git a/static/development-bundle/demos/draggable/revert.html b/static/development-bundle/demos/draggable/revert.html deleted file mode 100644 index c0321a3..0000000 --- a/static/development-bundle/demos/draggable/revert.html +++ /dev/null @@ -1,44 +0,0 @@ - - - - - jQuery UI Draggable - Revert position - - - - - - - - - - - - -

- -

Revert the original

- -

Revert the helper

- -

- - - -

Return the draggable (or it's helper) to its original location when dragging stops with the boolean revert option.

- - - diff --git a/static/development-bundle/demos/draggable/scroll.html b/static/development-bundle/demos/draggable/scroll.html deleted file mode 100644 index 00606a1..0000000 --- a/static/development-bundle/demos/draggable/scroll.html +++ /dev/null @@ -1,51 +0,0 @@ - - - - - jQuery UI Draggable - Auto-scroll - - - - - - - - - - - - -

- -

Scroll set to true, default settings

- -

scrollSensitivity set to 100

- -

scrollSpeed set to 100

- -

- - - -

Automatically scroll the document when the draggable is moved beyond the viewport. Set the scroll option to true to enable auto-scrolling, and fine-tune when scrolling is triggered and its speed with the scrollSensitivity and scrollSpeed options.

- - - diff --git a/static/development-bundle/demos/draggable/snap-to.html b/static/development-bundle/demos/draggable/snap-to.html deleted file mode 100644 index 43b4554..0000000 --- a/static/development-bundle/demos/draggable/snap-to.html +++ /dev/null @@ -1,68 +0,0 @@ - - - - - jQuery UI Draggable - Snap to element or grid - - - - - - - - - - - - -

- -

I'm a snap target

- -
- -

Default (snap: true), snaps to all other draggable elements

- -

I only snap to the big box

- -

I only snap to the outer edges of the big box

- -

I snap to a 20 x 20 grid

- -

I snap to a 80 x 80 grid

- -

- - - -

Snap the draggable to the inner or outer boundaries of a DOM element. Use the snap, snapMode (inner, outer, both), and snapTolerance (distance in pixels the draggable must be from the element when snapping is invoked) options.

Or snap the draggable to a grid. Set the dimensions of grid cells (height and width in pixels) with the grid option.

- - - diff --git a/static/development-bundle/demos/draggable/sortable.html b/static/development-bundle/demos/draggable/sortable.html deleted file mode 100644 index 481cae2..0000000 --- a/static/development-bundle/demos/draggable/sortable.html +++ /dev/null @@ -1,57 +0,0 @@ - - - - - jQuery UI Draggable + Sortable - - - - - - - - - - - - - -

- -

Drag me down

- -

Item 1
Item 2
Item 3
Item 4
Item 5

- -

- - - -

Draggables are built to interact seamlessly with sortables.

- - - diff --git a/static/development-bundle/demos/draggable/visual-feedback.html b/static/development-bundle/demos/draggable/visual-feedback.html deleted file mode 100644 index 0ac6479..0000000 --- a/static/development-bundle/demos/draggable/visual-feedback.html +++ /dev/null @@ -1,77 +0,0 @@ - - - - - jQuery UI Draggable - Visual feedback - - - - - - - - - - - - -

- -

With helpers:

- -

Original

- -

Semi-transparent clone

- -

Custom helper (in combination with cursorAt)

- -

Stacked:

We are draggables..

- -

..whose z-indexes are controlled automatically..

- -

..with the stack option.

- -

- - - -

Provide feedback to users as they drag an object in the form of a helper. The helper option accepts the values 'original' (the draggable object moves with the cursor), 'clone' (a duplicate of the draggable moves with the cursor), or a function that returns a DOM element (that element is shown near the cursor during drag). Control the helper's transparency with the opacity option.

To clarify which draggable is in play, bring the draggable in motion to front. Use the zIndex option to set a higher z-index for the helper, if in play, or use the stack option to ensure that the last item dragged will appear on top of others in the same group on drag stop.

- - - -- cgit v1.2.1