]> source.dussan.org Git - jquery-ui.git/commitdiff
demos: added demo wrappers, fixed some issues with non explicit css rules
authorPaul Bakaus <paul.bakaus@googlemail.com>
Wed, 31 Dec 2008 14:02:14 +0000 (14:02 +0000)
committerPaul Bakaus <paul.bakaus@googlemail.com>
Wed, 31 Dec 2008 14:02:14 +0000 (14:02 +0000)
14 files changed:
demos/draggable/axis.html
demos/draggable/containment.html
demos/draggable/cursorat.html
demos/draggable/default.html
demos/draggable/delaydistance.html
demos/draggable/grid.html
demos/draggable/handle.html
demos/draggable/helper.html
demos/draggable/opacity.html
demos/draggable/revert.html
demos/draggable/scroll.html
demos/draggable/snap.html
demos/draggable/sortable.html
demos/draggable/zindexstack.html

index 61dd072fb8d5f1dc81c91ae319ef1be868a7744d..e0913725261871ffb54f244a1b75fbc35e64d80c 100644 (file)
@@ -20,7 +20,8 @@
        </script>
 </head>
 <body>
-
+<div class="demo">
+       
 <div id="draggable" class="ui-widget-content">
        <p>I can be dragged only vertically</p>
 </div>
        <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>
index 9ffc4c95b30d0c88d7a4e72b535d14aa87f20302..8bcbb65563b35614f90a78701d7ec3781f6fb760 100644 (file)
@@ -19,7 +19,8 @@
        </script>
 </head>
 <body>
-
+<div class="demo">
+       
 <div id="draggable" class="ui-widget-content">
        <p>I'm contained within the window</p>
 </div>
        <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>
index e1c0c1b52d133591578d439dde4a50c1f389abe6..ef4bdc5de6338314540dd1a64a6c659a294ff899 100644 (file)
@@ -19,7 +19,8 @@
        </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>
        <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>
index 55a454ab98e40b46c09a018c93227ee1aa425616..4989c442224a49ad5a0916ae7cabffe52cd89092 100644 (file)
 </head>
 <body>
 
+<div class="demo">
+
 <div id="draggable" class="ui-widget-content">
        <p>Drag me around</p>
 </div>
 
+</div><!-- End demo -->
+
+<div class="demo-description">
+
+<p>
+The easiest way to make an element draggable. Hold down the mouse and drag it around.
+</p>
+
+</div><!-- End demo-description -->
+
 </body>
 </html>
index 64b1ff684cff2d45cc3ef18591388824b744b645..ddca971842fc12a78b658911186b1c3869ee70b8 100644 (file)
@@ -18,7 +18,8 @@
        </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>
        <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>
index 03741e4dc8903d51d870aa2b27876751015d4b81..0b717d7ebb06839ea90c81d0bfbd008456b9a7f5 100644 (file)
@@ -18,7 +18,8 @@
        </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>
        <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>
index 5dc9500508330b1106f9c9b83faf2926cf68f937..aa7acfd30858cdb2c936ba2eb9abfa3fc089ca0b 100644 (file)
        </script>
 </head>
 <body>
-
+<div class="demo">
+       
 <div id="draggable" class="ui-widget-content">
        <p class="ui-widget-header">I can be dragged only by this handle</p>
 </div>
 
+</div><!-- End demo -->
+
+<div class="demo-description">
+
+<p>
+<!-- Add description here -->
+</p>
+
+</div><!-- End demo-description -->
 </body>
 </html>
index 5bbdde4aa760fdff249caa553cb5ed3aa6eeae2e..0039b9895c787bd578852a6d05ee4bbc26dc0238 100644 (file)
@@ -25,6 +25,7 @@
        </script>
 </head>
 <body>
+<div class="demo">
 
 <div id="draggable" class="ui-widget-content">
        <p>Original</p>
        <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>
index b9e5481ec49535f492d8349a2702e65560a5f859..652be35b52cc354ac9daf17cb583bd7ff275aa60 100644 (file)
@@ -18,7 +18,8 @@
        </script>
 </head>
 <body>
-
+<div class="demo">
+       
 <div id="draggable1" class="ui-widget-content">
        <p>Opacity set to 0.5</p>
 </div>
        <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>
index 87822f8cb48613a1eec2555adee467ff3aedc6e1..6e9ceae70f1dd8f938c2ce077d3dbf432e03dbd4 100644 (file)
@@ -18,7 +18,8 @@
        </script>
 </head>
 <body>
-
+<div class="demo">
+       
 <div id="draggable" class="ui-widget-content">
        <p>Revert the original</p>
 </div>
        <p>Revert the helper</p>
 </div>
 
+</div><!-- End demo -->
+
+<div class="demo-description">
+
+<p>
+<!-- Add description here -->
+</p>
+
+</div><!-- End demo-description -->
 </body>
 </html>
index ee1abd2f2779cddc883f64acbd9b9238e164d821..f4863e9546581657ec449cfcc2fde5b4153edf7d 100644 (file)
@@ -19,7 +19,8 @@
        </script>
 </head>
 <body>
-
+<div class="demo">
+       
 <div id="draggable" class="ui-widget-content">
        <p>Scroll set to true, default settings</p>
 </div>
 
 <div style='height: 5000px; width: 1px;'></div>
 
+</div><!-- End demo -->
+
+<div class="demo-description">
+
+<p>
+<!-- Add description here -->
+</p>
+
+</div><!-- End demo-description -->
 </body>
 </html>
index 0394196a5a84f4215c5b35a3b175c5837c0eb9eb..1d76ca3cd4658532b4706e1fe36208bfe7e720c0 100644 (file)
@@ -22,7 +22,8 @@
        </script>
 </head>
 <body>
-
+<div class="demo">
+       
 <div id="snaptarget" class="ui-widget-header">
        <p>I'm a snap target</p>
 </div>
 </div>
 
 
+</div><!-- End demo -->
+
+<div class="demo-description">
+
+<p>
+<!-- Add description here -->
+</p>
+
+</div><!-- End demo-description -->
 
 
 
index 292f3e31ddfe11680ba605b2561f06df183b10c3..0e2df15c8d7077c1afd5d3d15e93f2ca9bdb4113 100644 (file)
@@ -9,21 +9,22 @@
        <script type="text/javascript" src="../../ui/ui.sortable.js"></script>
        <link type="text/css" href="../demos.css" rel="stylesheet" />
        <style type="text/css">
-       ul { list-style-type: none; margin: 0; padding: 0; margin-bottom: 10px; }
-       li { margin: 3px; padding: 2px; width: 150px; }
+       #sortable { list-style-type: none; margin: 0; padding: 0; margin-bottom: 10px; }
+       #sortable li { margin: 3px; padding: 2px; width: 150px; }
        </style>
        <script type="text/javascript">
        $(function() {
                $("#sortable").sortable();
                $("#draggable").draggable({
-                       connectToSortable: ['ul'],
+                       connectToSortable: ['#sortable'],
                        helper: 'clone'
                });
        });
        </script>
 </head>
 <body>
-
+<div class="demo">
+       
 <ul>
        <li id="draggable" class="ui-state-highlight">Drag me down</li>
 </ul>
        <li class="ui-state-default">Item 5</li>
 </ul>
 
+</div><!-- End demo -->
+
+<div class="demo-description">
+
+<p>
+<!-- Add description here -->
+</p>
+
+</div><!-- End demo-description -->
 </body>
 </html>
index d41c6a5c65db0af90b0b66f96c9b35cb1d5125e2..bbbbba0450ed9b471c87bf31d3db87590be7b06a 100644 (file)
@@ -19,7 +19,8 @@
        </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>
 </div>
 
+</div><!-- End demo -->
+
+<div class="demo-description">
+
+<p>
+<!-- Add description here -->
+</p>
+
+</div><!-- End demo-description -->
 </body>
 </html>