aboutsummaryrefslogtreecommitdiffstats
path: root/tests/visual/draggable
diff options
context:
space:
mode:
authorRichard Worth <rdworth@gmail.com>2009-01-22 12:01:20 +0000
committerRichard Worth <rdworth@gmail.com>2009-01-22 12:01:20 +0000
commitf3b91832ce164d1ec80d29b83c92535e4a2f8b0b (patch)
treedc4117c1c28df7212fb2a163b9cf69ff3d745301 /tests/visual/draggable
parent892c52225b9c1f7dcb2ec9ff990a458dbe0002ce (diff)
downloadjquery-ui-f3b91832ce164d1ec80d29b83c92535e4a2f8b0b.tar.gz
jquery-ui-f3b91832ce164d1ec80d29b83c92535e4a2f8b0b.zip
tests: Added extra folder level for each plugin in static and visual test folders
Diffstat (limited to 'tests/visual/draggable')
-rw-r--r--tests/visual/draggable/draggable.handle.html30
-rw-r--r--tests/visual/draggable/draggable.html26
-rw-r--r--tests/visual/draggable/draggable.scroll.html149
3 files changed, 205 insertions, 0 deletions
diff --git a/tests/visual/draggable/draggable.handle.html b/tests/visual/draggable/draggable.handle.html
new file mode 100644
index 000000000..1ff9b39fc
--- /dev/null
+++ b/tests/visual/draggable/draggable.handle.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Simple Draggable with Handle</title>
+ <link rel="stylesheet" href="../all.css" type="text/css">
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.1.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.draggable.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#draggable").draggable({
+ handle: "span"
+ });
+ });
+ </script>
+</head>
+<body>
+
+<ul class="plugins">
+<li class="plugin">
+ Draggable
+ <div id="draggable">
+ <span>Handle</span>
+ </div>
+</li>
+</ul>
+
+</body>
+</html>
diff --git a/tests/visual/draggable/draggable.html b/tests/visual/draggable/draggable.html
new file mode 100644
index 000000000..fb9b8c3de
--- /dev/null
+++ b/tests/visual/draggable/draggable.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Simple Draggable</title>
+ <link rel="stylesheet" href="../all.css" type="text/css">
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.1.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.draggable.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#draggable").draggable();
+ });
+ </script>
+</head>
+<body>
+
+<ul class="plugins">
+<li class="plugin">
+ Draggable
+ <div id="draggable"></div>
+</li>
+</ul>
+
+</body>
+</html>
diff --git a/tests/visual/draggable/draggable.scroll.html b/tests/visual/draggable/draggable.scroll.html
new file mode 100644
index 000000000..e79f19338
--- /dev/null
+++ b/tests/visual/draggable/draggable.scroll.html
@@ -0,0 +1,149 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Draggable Scroll Tests</title>
+ <link rel="stylesheet" href="../all.css" type="text/css">
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.1.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.draggable.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.sortable.js"></script>
+ <style type="text/css">
+ .draggable {
+ width:100px;
+ height:100px;
+ background-color:green;
+ color: #fff;
+ padding: 5px;
+ margin: 5px;
+ border: 5px solid red;
+ }
+ .container {
+ width: 500px;
+ height: 200px;
+ border: 5px solid black;
+ padding: 5px;
+ margin: 5px;
+ float: left;
+ background: #fff;
+ }
+ .enlarge {
+ width: 1000px;
+ height: 1000px;
+ }
+ </style>
+ <script type="text/javascript">
+ $(function(){
+ $(".draggable").draggable({
+ //helper: 'clone',
+ drag: function(e, ui) {
+ //console.log(ui.helper.offset());
+ },
+ scroll:true
+ //containment:"parent"
+ });
+ });
+ </script>
+</head>
+<body>
+
+<div class='draggable' style='z-index: 1000;'>Simple draggable</div>
+<br clear='both' />
+
+
+<div class='container' style="overflow:scroll;">
+ <div class='draggable'>(Broken in IE)</div>
+ <div class='enlarge'></div>
+</div>
+
+<div class='container' style="overflow:scroll; position: relative;">
+ <div class='draggable'></div>
+ <div class='enlarge'></div>
+</div>
+
+<div class='container' style="overflow:scroll;">
+ <div class='draggable' style='position: absolute;top:0px;left:1000px;'>Absolute</div>
+ <div class='enlarge'></div>
+</div>
+
+<div class='container' style="overflow:scroll; position: relative;">
+ <div class='draggable' style='position: absolute;'>Absolute</div>
+ <div class='enlarge'></div>
+</div>
+
+<div class='container' style="overflow:scroll;">
+ <div class='draggable' style='position: fixed;'>Fixed</div>
+ <div class='enlarge'></div>
+</div>
+
+<div class='container' style="overflow:scroll; position: relative;">
+ <div class='draggable' style='position: fixed;'>Fixed</div>
+ <div class='enlarge'></div>
+</div>
+
+<!-- Relative draggable with two containers -->
+
+<div class='container' style="overflow:scroll; position: relative;">
+ <div class='container'>
+ <div class='draggable'>Relative</div>
+ <div class='enlarge'></div>
+ </div>
+
+</div>
+
+<div class='container' style="overflow:scroll; position: relative;">
+ <div class='container' style='position: relative;'>
+ <div class='draggable'>Relative</div>
+ <div class='enlarge'></div>
+ </div>
+</div>
+
+<div class='container' style="position: relative;">
+ <div class='container' style='overflow: scroll;'>
+ <div class='draggable'>Relative (Broken in IE)</div>
+ <div class='enlarge'></div>
+ </div>
+
+</div>
+
+<div class='container' style="position: relative;">
+ <div class='container' style='position: relative; overflow: scroll;'>
+ <div class='draggable'>Relative</div>
+ <div class='enlarge'></div>
+ </div>
+</div>
+
+<!-- Absolute draggable with two containers -->
+
+<div class='container' style="overflow:scroll; position: relative;">
+ <div class='container'>
+ <div class='draggable' style='position: absolute;'>Absolute</div>
+ <div class='enlarge'></div>
+ </div>
+
+</div>
+
+<div class='container' style="overflow:scroll; position: relative;">
+ <div class='container' style='position: relative;'>
+ <div class='draggable' style='position: absolute;'>Absolute</div>
+ <div class='enlarge'></div>
+ </div>
+</div>
+
+<div class='container' style="position: relative;">
+ <div class='container' style='overflow: scroll;'>
+ <div class='draggable' style='position: absolute;top:0px;left:0px;'>Absolute</div>
+ <div class='enlarge'></div>
+ </div>
+
+</div>
+
+<div class='container' style="position: relative;">
+ <div class='container' style='position: relative; overflow: scroll;'>
+ <div class='draggable' style='position: absolute;'>Absolute</div>
+ <div class='enlarge'></div>
+ </div>
+</div>
+
+</body>
+</html>