Ticket #5772: jQuerySortable.html

File jQuerySortable.html, 1.2 KB (added by meyerovb, June 26, 2010 06:32PM UTC)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>jQuery UI sortable containment parent first/last bug</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script>
    <style type="text/css">#sortable{width:250px;padding:2px;border:1px solid;}#sortable>div{border:1px solid;margin:2px;}</style>
    <script type="text/jscript">$(function () { $("#sortable").sortable({ containment: 'parent' }); });</script>
</head>
<body>
    Try to drag it by the red area, it won't reorder.  Drag it by green and it works.<br /><br />
    <div id="sortable">
        <div>
            <div style="background-color: Red;">&nbsp;</div>
            <div style="background-color: Green;">&nbsp;</div>
        </div>
        <div>
            <div style="background-color: Green;">&nbsp;</div>
            <div style="background-color: Red;">&nbsp;</div>
        </div>
    </div>
</body>
</html>

Download in other formats:

Original Format