library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Visual testcase for #4231

Browse Source
This commit is contained in:
Jörn Zaefferer 2010-02-24 19:27:13 +00:00
parent 8b20f1ff9b
commit 1fd3e6bd0b
1 changed files with 79 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
tests/visual/sortable/sortable_ticket_4231.html Normal file
View File

@ -0,0 +1,79 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="../visual.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
<script type="text/javascript" src="../../../jquery-1.4.2.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.droppable.js"></script>
<script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
<meta charset=utf-8 />
<title>Visual testcase for #4231</title>
<style>
.scrollArea {
overflow: auto;
width: 400px;
height: 600px;
}
.dropArea {
height: 100px;
width: 380px;
padding: 0 0 0 0;
background-color: #CCCCCC;
margin: 10px 0 10px 0;
}
.dragArea {
width: 100px;
height: 30px;
background-color: #FF0000;
margin: 10px 0 10px 0;
}
.inv {
position: absolute;
left: 450px;
top: 10px;
width: 150px;
height: 600px;
}
</style>
<script>jQuery(document).ready(function(){
$(".dropArea").droppable({
drop: function(ev, ui) { $(ui.draggable).html("dropped"); }
})
.sortable();
$(".dragArea").draggable({
connectToSortable: '.dropArea',
revert: 'invalid',
helper: 'clone'
});
});
</script>
</head>
<body>
<div class="scrollArea">
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
<ul class="dropArea"></ul>
</div>
<ul class="inv">
<li class="dragArea">Drag me</li>
<li class="dragArea">Drag me</li>
<li class="dragArea">Drag me</li>
</ul>
</body>
</html>