diff options
author | Richard Worth <rdworth@gmail.com> | 2009-01-16 05:48:19 +0000 |
---|---|---|
committer | Richard Worth <rdworth@gmail.com> | 2009-01-16 05:48:19 +0000 |
commit | fbc962faf66f793228bd5e3f62f7f1d2932d3715 (patch) | |
tree | 5ea0fa46a98bf35abec5a2549fbe815f8a6dbc50 /demos/draggable | |
parent | 02358dc5f25d331257e0788c721a0f571d79e95f (diff) | |
download | jquery-ui-fbc962faf66f793228bd5e3f62f7f1d2932d3715.tar.gz jquery-ui-fbc962faf66f793228bd5e3f62f7f1d2932d3715.zip |
demos/draggable: removed old demo files
Diffstat (limited to 'demos/draggable')
-rw-r--r-- | demos/draggable/axis.html | 43 | ||||
-rw-r--r-- | demos/draggable/cancel.html | 40 | ||||
-rw-r--r-- | demos/draggable/containment.html | 16 | ||||
-rw-r--r-- | demos/draggable/containment_iframe.html | 49 | ||||
-rw-r--r-- | demos/draggable/cursorat.html | 46 | ||||
-rw-r--r-- | demos/draggable/delaydistance.html | 41 | ||||
-rw-r--r-- | demos/draggable/grid.html | 41 | ||||
-rw-r--r-- | demos/draggable/helper.html | 52 | ||||
-rw-r--r-- | demos/draggable/opacity.html | 41 | ||||
-rw-r--r-- | demos/draggable/snap.html | 68 | ||||
-rw-r--r-- | demos/draggable/zindexstack.html | 52 |
11 files changed, 0 insertions, 489 deletions
diff --git a/demos/draggable/axis.html b/demos/draggable/axis.html deleted file mode 100644 index da78902aa..000000000 --- a/demos/draggable/axis.html +++ /dev/null @@ -1,43 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - Axis Demo</title> - <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> - <script type="text/javascript" src="../../jquery-1.3.js"></script> - <script type="text/javascript" src="../../ui/ui.core.js"></script> - <script type="text/javascript" src="../../ui/ui.draggable.js"></script> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css"> - #draggable, #draggable2 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 5px; } - #draggable { cursor: n-resize; } - #draggable2 { cursor: e-resize; } - </style> - <script type="text/javascript"> - $(function() { - $("#draggable").draggable({ axis: 'y' }); - $("#draggable2").draggable({ axis: 'x' }); - }); - </script> -</head> -<body> -<div class="demo"> - -<div id="draggable" class="ui-widget-content"> - <p>I can be dragged only vertically</p> -</div> - -<div id="draggable2" class="ui-widget-content"> - <p>I can be dragged only horizontally</p> -</div> - -</div><!-- End demo --> - -<div class="demo-description"> - -<p> -<!-- Add description here --> -</p> - -</div><!-- End demo-description --> -</body> -</html> diff --git a/demos/draggable/cancel.html b/demos/draggable/cancel.html deleted file mode 100644 index ff0d8d69e..000000000 --- a/demos/draggable/cancel.html +++ /dev/null @@ -1,40 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - Cancel Demo</title> - <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> - <script type="text/javascript" src="../../jquery-1.3.js"></script> - <script type="text/javascript" src="../../ui/ui.core.js"></script> - <script type="text/javascript" src="../../ui/ui.draggable.js"></script> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css"> - #draggable { width: 150px; height: 150px; padding: 0.5em; cursor: move; } - #draggable p.ui-widget-header { cursor: default; } - </style> - <script type="text/javascript"> - $(function() { - $("#draggable").draggable({ cancel: "p.ui-widget-header" }); - }); - </script> -</head> -<body> - -<div class="demo"> - -<div id="draggable" class="ui-widget-content"> - <p>You can drag me around…</p> - <p class="ui-widget-header">…but you can't drag me by this handle.</p> -</div> - -</div><!-- End demo --> - -<div class="demo-description"> - -<p> -<!-- Add description here --> -</p> - -</div><!-- End demo-description --> - -</body> -</html> diff --git a/demos/draggable/containment.html b/demos/draggable/containment.html deleted file mode 100644 index 7832e547d..000000000 --- a/demos/draggable/containment.html +++ /dev/null @@ -1,16 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - Containment Demo</title> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css" media="screen"> - body,html { - padding:0;margin:0;width:100%;height:100%; - } - </style> -</head> -<body> -<iframe frameborder='0' style='width: 100%; height: 99%;' src='containment_iframe.html'></iframe> - -</body> -</html> diff --git a/demos/draggable/containment_iframe.html b/demos/draggable/containment_iframe.html deleted file mode 100644 index 7416afb10..000000000 --- a/demos/draggable/containment_iframe.html +++ /dev/null @@ -1,49 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - Containment Demo</title> - <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> - <script type="text/javascript" src="../../jquery-1.3.js"></script> - <script type="text/javascript" src="../../ui/ui.core.js"></script> - <script type="text/javascript" src="../../ui/ui.draggable.js"></script> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css"> - div.demo { padding:0; } - .ui-widget-content { width: 100px; height: 100px; padding: 0.5em; float: left; margin:0 10px 0 0; } - </style> - <script type="text/javascript"> - $(function() { - $("#draggable").draggable({ containment: 'window', scroll: false }); - $("#draggable2").draggable({ containment: 'document' }); - $("#draggable3").draggable({ containment: 'parent' }); - }); - </script> -</head> -<body> -<div class="demo"> - -<div id="draggable" class="ui-widget-content"> - <p>I'm contained within the window</p> -</div> - -<div id="draggable2" class="ui-widget-content"> - <p>I'm contained within the document</p> -</div> - -<div class="ui-widget-content"> - <p id="draggable3" class='ui-widget-header'>I'm contained within my parent</p> -</div> - -</div><!-- End demo --> - -<div class="demo-description"> - -<p> -<!-- Add description here --> -</p> - -</div><!-- End demo-description --> -<div style='width: 1px; height: 500px;'></div> - -</body> -</html> diff --git a/demos/draggable/cursorat.html b/demos/draggable/cursorat.html deleted file mode 100644 index 5a389309e..000000000 --- a/demos/draggable/cursorat.html +++ /dev/null @@ -1,46 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - cursorAt Demo</title> - <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> - <script type="text/javascript" src="../../jquery-1.3.js"></script> - <script type="text/javascript" src="../../ui/ui.core.js"></script> - <script type="text/javascript" src="../../ui/ui.draggable.js"></script> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css"> - #draggable, #draggable2, #draggable3 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 5px; } - </style> - <script type="text/javascript"> - $(function() { - $("#draggable").draggable({ cursorAt: { top: 56, left: 56 } }); - $("#draggable2").draggable({ cursorAt: { top: -5, left: -5 } }); - $("#draggable3").draggable({ cursorAt: { bottom: 0 } }); - }); - </script> -</head> -<body> -<div class="demo"> - -<div id="draggable" class="ui-widget-content"> - <p>I will always stick to the center (relative to the mouse)</p> -</div> - -<div id="draggable2" class="ui-widget-content"> - <p>My cursor is at left -5 and top -5</p> -</div> - -<div id="draggable3" class="ui-widget-content"> - <p>My cursor position is only controlled for the 'bottom' value</p> -</div> - -</div><!-- End demo --> - -<div class="demo-description"> - -<p> -<!-- Add description here --> -</p> - -</div><!-- End demo-description --> -</body> -</html> diff --git a/demos/draggable/delaydistance.html b/demos/draggable/delaydistance.html deleted file mode 100644 index 8a1a097f2..000000000 --- a/demos/draggable/delaydistance.html +++ /dev/null @@ -1,41 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - Delay / Distance Demo</title> - <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> - <script type="text/javascript" src="../../jquery-1.3.js"></script> - <script type="text/javascript" src="../../ui/ui.core.js"></script> - <script type="text/javascript" src="../../ui/ui.draggable.js"></script> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css"> - #draggable, #draggable2 { width: 120px; height: 120px; padding: 0.5em; float: left; margin: 5px; } - </style> - <script type="text/javascript"> - $(function() { - $("#draggable").draggable({ distance: 20 }); - $("#draggable2").draggable({ delay: 1000 }); - }); - </script> -</head> -<body> -<div class="demo"> - -<div id="draggable" class="ui-widget-content"> - <p>Only if you drag me by 20 pixels, the dragging will start</p> -</div> - -<div id="draggable2" class="ui-widget-content"> - <p>Regardless of the distance, you have to drag and wait for 1000ms before dragging starts</p> -</div> - -</div><!-- End demo --> - -<div class="demo-description"> - -<p> -<!-- Add description here --> -</p> - -</div><!-- End demo-description --> -</body> -</html> diff --git a/demos/draggable/grid.html b/demos/draggable/grid.html deleted file mode 100644 index a572f5546..000000000 --- a/demos/draggable/grid.html +++ /dev/null @@ -1,41 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - Grid Demo</title> - <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> - <script type="text/javascript" src="../../jquery-1.3.js"></script> - <script type="text/javascript" src="../../ui/ui.core.js"></script> - <script type="text/javascript" src="../../ui/ui.draggable.js"></script> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css"> - #draggable, #draggable2 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 5px; } - </style> - <script type="text/javascript"> - $(function() { - $("#draggable").draggable({ grid: [20,20] }); - $("#draggable2").draggable({ grid: [1,50] }); - }); - </script> -</head> -<body> -<div class="demo"> - -<div id="draggable" class="ui-widget-content"> - <p>I can be dragged in a 20x20 grid system</p> -</div> - -<div id="draggable2" class="ui-widget-content"> - <p>I only follow a vertical 50 pixel grid</p> -</div> - -</div><!-- End demo --> - -<div class="demo-description"> - -<p> -<!-- Add description here --> -</p> - -</div><!-- End demo-description --> -</body> -</html> diff --git a/demos/draggable/helper.html b/demos/draggable/helper.html deleted file mode 100644 index b6832c7af..000000000 --- a/demos/draggable/helper.html +++ /dev/null @@ -1,52 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - Helper Demo</title> - <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> - <script type="text/javascript" src="../../jquery-1.3.js"></script> - <script type="text/javascript" src="../../ui/ui.core.js"></script> - <script type="text/javascript" src="../../ui/ui.draggable.js"></script> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css"> - #draggable, #draggable2, #draggable3 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 5px; } - </style> - <script type="text/javascript"> - $(function() { - $("#draggable").draggable({ helper: 'original' }); - $("#draggable2").draggable({ helper: 'clone' }); - $("#draggable3").draggable({ - cursor: 'move', - cursorAt: { top: -12, left: -20 }, - helper: function(event) { - return $('<div class="ui-widget-header">I\'m a custom helper</div>'); - } - }); - }); - </script> -</head> -<body> -<div class="demo"> - -<div id="draggable" class="ui-widget-content"> - <p>Original</p> -</div> - -<div id="draggable2" class="ui-widget-content"> - <p>Clone</p> -</div> - -<div id="draggable3" class="ui-widget-content"> - <p>Custom helper (in combination with cursorAt)</p> -</div> - -</div><!-- End demo --> - -<div class="demo-description"> - -<p> -<!-- Add description here --> -</p> - -</div><!-- End demo-description --> -</body> -</html> diff --git a/demos/draggable/opacity.html b/demos/draggable/opacity.html deleted file mode 100644 index 208a01fc3..000000000 --- a/demos/draggable/opacity.html +++ /dev/null @@ -1,41 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - Opacity Demo</title> - <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> - <script type="text/javascript" src="../../jquery-1.3.js"></script> - <script type="text/javascript" src="../../ui/ui.core.js"></script> - <script type="text/javascript" src="../../ui/ui.draggable.js"></script> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css"> - #draggable1, #draggable2 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 5px; } - </style> - <script type="text/javascript"> - $(function() { - $("#draggable1").draggable({ opacity: 0.5 }); - $("#draggable2").draggable({ opacity: 0.5, helper: 'clone' }); - }); - </script> -</head> -<body> -<div class="demo"> - -<div id="draggable1" class="ui-widget-content"> - <p>Opacity set to 0.5</p> -</div> - -<div id="draggable2" class="ui-widget-content"> - <p>Opacity set to 0.5, using 'clone' as helper</p> -</div> - -</div><!-- End demo --> - -<div class="demo-description"> - -<p> -<!-- Add description here --> -</p> - -</div><!-- End demo-description --> -</body> -</html> diff --git a/demos/draggable/snap.html b/demos/draggable/snap.html deleted file mode 100644 index 7eeca6229..000000000 --- a/demos/draggable/snap.html +++ /dev/null @@ -1,68 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - Snap Demo</title> - <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> - <script type="text/javascript" src="../../jquery-1.3.js"></script> - <script type="text/javascript" src="../../ui/ui.core.js"></script> - <script type="text/javascript" src="../../ui/ui.draggable.js"></script> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css"> - #draggable, #draggable2, #draggable3, #draggable4, #draggable5 { width: 100px; height: 80px; padding: 5px; float: left; margin: 5px; font-size: .9em; } - .ui-widget-header p, .ui-widget-content p { margin: 0; } - #snaptarget { height: 140px; } - </style> - <script type="text/javascript"> - $(function() { - $("#draggable").draggable({ snap: true }); - $("#draggable2").draggable({ snap: '.ui-widget-header' }); - $("#draggable3").draggable({ snap: '.ui-widget-header', snapMode: 'outer' }); - $("#draggable4").draggable({ snap: '.ui-widget-header', snapMode: 'inner' }); - $("#draggable5").draggable({ snap: '.ui-widget-header', snapTolerance: 50 }); - }); - </script> -</head> -<body> -<div class="demo"> - -<div id="snaptarget" class="ui-widget-header"> - <p>I'm a snap target</p> -</div> - -<br clear="both" /> - -<div id="draggable" class="ui-widget-content"> - <p>Default (snap: true), snaps to all other draggable elements</p> -</div> - -<div id="draggable2" class="ui-widget-content"> - <p>I only snap to the big box</p> -</div> - -<div id="draggable3" class="ui-widget-content"> - <p>I only snap to the outer edges of the bix box</p> -</div> - -<div id="draggable4" class="ui-widget-content"> - <p>I only snap to the inner edges of the big box</p> -</div> - -<div id="draggable5" class="ui-widget-content"> - <p>I also snap to the big box but I'm very sticky because I have a high tolerance</p> -</div> - - -</div><!-- End demo --> - -<div class="demo-description"> - -<p> -<!-- Add description here --> -</p> - -</div><!-- End demo-description --> - - - -</body> -</html> diff --git a/demos/draggable/zindexstack.html b/demos/draggable/zindexstack.html deleted file mode 100644 index a455308a0..000000000 --- a/demos/draggable/zindexstack.html +++ /dev/null @@ -1,52 +0,0 @@ -<!doctype html> -<html lang="en"> -<head> - <title>jQuery UI Draggable - Z-Index / Stack Demo</title> - <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> - <script type="text/javascript" src="../../jquery-1.3.js"></script> - <script type="text/javascript" src="../../ui/ui.core.js"></script> - <script type="text/javascript" src="../../ui/ui.draggable.js"></script> - <link type="text/css" href="../demos.css" rel="stylesheet" /> - <style type="text/css"> - #draggable, #set, #set div { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 5px; } - #set { width: 368px; height: 120px; } - </style> - <script type="text/javascript"> - $(function() { - $("#draggable").draggable({ zIndex: 1000 }); - $("#set div").draggable({ stack: { group: '#set div', min: 1 } }); - }); - </script> -</head> -<body> -<div class="demo"> - -<div id="draggable" class="ui-widget-content"> - <p>I always have a higher z-index than my siblings during drag</p> -</div> - -<div id="set" class="ui-widget-content"> - <div class="ui-widget-content"> - <p>We are draggables..</p> - </div> - - <div class="ui-widget-content"> - <p>..whose z-indexes are controlled automatically..</p> - </div> - - <div class="ui-widget-content"> - <p>..with the stack option.</p> - </div> -</div> - -</div><!-- End demo --> - -<div class="demo-description"> - -<p> -<!-- Add description here --> -</p> - -</div><!-- End demo-description --> -</body> -</html> |