aboutsummaryrefslogtreecommitdiffstats
path: root/demos/sortable
diff options
context:
space:
mode:
authorRichard Worth <rdworth@gmail.com>2008-12-31 23:10:48 +0000
committerRichard Worth <rdworth@gmail.com>2008-12-31 23:10:48 +0000
commit2b67c85b3672c40623892504af33ecd8953fd351 (patch)
tree1408cb8428815c0d5cbbc2d2b950346c23912c4a /demos/sortable
parent52739742794755e8472fbe05c84d510a2108a442 (diff)
downloadjquery-ui-2b67c85b3672c40623892504af33ecd8953fd351.tar.gz
jquery-ui-2b67c85b3672c40623892504af33ecd8953fd351.zip
demos/sortable: touched up sortable demos
Diffstat (limited to 'demos/sortable')
-rw-r--r--demos/sortable/default.html12
-rw-r--r--demos/sortable/delaydistance.html2
-rw-r--r--demos/sortable/droponempty.html2
-rw-r--r--demos/sortable/droppable.html2
-rw-r--r--demos/sortable/floating.html28
-rw-r--r--demos/sortable/items.html2
-rw-r--r--demos/sortable/placeholder.html8
7 files changed, 26 insertions, 30 deletions
diff --git a/demos/sortable/default.html b/demos/sortable/default.html
index e1d539b69..cc00ce233 100644
--- a/demos/sortable/default.html
+++ b/demos/sortable/default.html
@@ -8,19 +8,19 @@
<script type="text/javascript" src="../../ui/ui.sortable.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
- .demo ul { list-style-type: none; margin: 0; padding: 0; }
- .demo li { margin: 3px; padding: 2px; }
+ #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
+ #sortable li { margin: 3px; padding: 0.4em; font-size: 1.6em; height: 1.4em; }
</style>
<script type="text/javascript">
$(function() {
- $("ul").sortable();
+ $("#sortable").sortable();
});
</script>
</head>
<body>
<div class="demo">
-<ul>
+<ul id="sortable">
<li class="ui-state-default">Item 1</li>
<li class="ui-state-default">Item 2</li>
<li class="ui-state-default">Item 3</li>
@@ -29,8 +29,6 @@
<li class="ui-state-default">Item 6</li>
<li class="ui-state-default">Item 7</li>
<li class="ui-state-default">Item 8</li>
- <li class="ui-state-default">Item 9</li>
- <li class="ui-state-default">Item 10</li>
</ul>
</div><!-- End demo -->
@@ -38,7 +36,7 @@
<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 -->
diff --git a/demos/sortable/delaydistance.html b/demos/sortable/delaydistance.html
index 94391e220..f2fb94bf4 100644
--- a/demos/sortable/delaydistance.html
+++ b/demos/sortable/delaydistance.html
@@ -53,7 +53,7 @@
<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 -->
diff --git a/demos/sortable/droponempty.html b/demos/sortable/droponempty.html
index 448f8f6ab..dd0a95d26 100644
--- a/demos/sortable/droponempty.html
+++ b/demos/sortable/droponempty.html
@@ -53,7 +53,7 @@
<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 -->
diff --git a/demos/sortable/droppable.html b/demos/sortable/droppable.html
index 46ca84d79..a962076f0 100644
--- a/demos/sortable/droppable.html
+++ b/demos/sortable/droppable.html
@@ -46,7 +46,7 @@
<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 -->
diff --git a/demos/sortable/floating.html b/demos/sortable/floating.html
index 039cac024..47e472fd2 100644
--- a/demos/sortable/floating.html
+++ b/demos/sortable/floating.html
@@ -9,7 +9,7 @@
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
#sortable { list-style-type: none; margin: 0; padding: 0; }
- #sortable li { margin: 3px; padding: 2px; float: left; width: 100px; height: 100px; }
+ #sortable li { margin: 3px; padding: 1px; float: left; width: 100px; height: 100px; font-size: 4em; text-align: center; }
</style>
<script type="text/javascript">
$(function() {
@@ -21,18 +21,18 @@
<div class="demo">
<ul id="sortable">
- <li class="ui-state-default">Item 1</li>
- <li class="ui-state-default">Item 2</li>
- <li class="ui-state-default">Item 3</li>
- <li class="ui-state-default">Item 4</li>
- <li class="ui-state-default">Item 5</li>
- <li class="ui-state-default">Item 6</li>
- <li class="ui-state-default">Item 7</li>
- <li class="ui-state-default">Item 8</li>
- <li class="ui-state-default">Item 9</li>
- <li class="ui-state-default">Item 10</li>
- <li class="ui-state-default">Item 11</li>
- <li class="ui-state-default">Item 12</li>
+ <li class="ui-state-default">1</li>
+ <li class="ui-state-default">2</li>
+ <li class="ui-state-default">3</li>
+ <li class="ui-state-default">4</li>
+ <li class="ui-state-default">5</li>
+ <li class="ui-state-default">6</li>
+ <li class="ui-state-default">7</li>
+ <li class="ui-state-default">8</li>
+ <li class="ui-state-default">9</li>
+ <li class="ui-state-default">10</li>
+ <li class="ui-state-default">11</li>
+ <li class="ui-state-default">12</li>
</ul>
</div><!-- End demo -->
@@ -40,7 +40,7 @@
<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 -->
diff --git a/demos/sortable/items.html b/demos/sortable/items.html
index 4fed45bd5..3207b1df5 100644
--- a/demos/sortable/items.html
+++ b/demos/sortable/items.html
@@ -50,7 +50,7 @@
<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 -->
diff --git a/demos/sortable/placeholder.html b/demos/sortable/placeholder.html
index 4b32c3eea..be21ca419 100644
--- a/demos/sortable/placeholder.html
+++ b/demos/sortable/placeholder.html
@@ -8,8 +8,8 @@
<script type="text/javascript" src="../../ui/ui.sortable.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
- #sortable { list-style-type: none; margin: 0; padding: 0; }
- #sortable li { margin: 3px; padding: 2px; }
+ #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
+ #sortable li { margin: 3px; padding: 0.4em; font-size: 1.6em; height: 1.4em; }
</style>
<script type="text/javascript">
$(function() {
@@ -31,8 +31,6 @@
<li class="ui-state-default">Item 6</li>
<li class="ui-state-default">Item 7</li>
<li class="ui-state-default">Item 8</li>
- <li class="ui-state-default">Item 9</li>
- <li class="ui-state-default">Item 10</li>
</ul>
</div><!-- End demo -->
@@ -40,7 +38,7 @@
<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 -->