Ticket #5772: jQuerySortable.html

File jQuerySortable.html, 1.2 KB (added by meyerovb, 12 years ago)
Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2<html xmlns="http://www.w3.org/1999/xhtml">
3<head>
4    <title>jQuery UI sortable containment parent first/last bug</title>
5    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
6    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script>
7    <style type="text/css">#sortable{width:250px;padding:2px;border:1px solid;}#sortable>div{border:1px solid;margin:2px;}</style>
8    <script type="text/jscript">$(function () { $("#sortable").sortable({ containment: 'parent' }); });</script>
9</head>
10<body>
11    Try to drag it by the red area, it won't reorder.  Drag it by green and it works.<br /><br />
12    <div id="sortable">
13        <div>
14            <div style="background-color: Red;">&nbsp;</div>
15            <div style="background-color: Green;">&nbsp;</div>
16        </div>
17        <div>
18            <div style="background-color: Green;">&nbsp;</div>
19            <div style="background-color: Red;">&nbsp;</div>
20        </div>
21    </div>
22</body>
23</html>