Bugs of sortable

Bugs of sortable


Hi,
I found two possible bugs on sortable, and I would like some help.
The first, when I apply the "sortable" to a list that contains a div
with some height (like 500px) and set the containment to this list, I
cannot drag this div to bottom and sometimes to top. There is an
example (try to drag the orange div to the bottom):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/
TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Draggables Simple Example</title>
<script type="text/javascript" src="js/jquery-1.2.5.js"></script>
    <script src="js/ui.core.js"></script>
    <script src="js/ui.sortable.js"></script>
    <script src="js/ui.draggable.js"></script>
    <script src="js/ui.droppable.js"></script>
    <script type="text/javascript">
        window.onload = function()
        {
            $("#dropZone").sortable(
            {
                axis: 'y',
                containment: $("#dropZone"),
                scroll: true,
                helper: 'clone',
                revert: true,
                placeholder: 'placeHolder',
            });
        }
    </script>
    <style type="text/css">
        #dropZone
        {
            width: 580px;
            background-color: #FFFFFF;
            border: 1px ridge maroon;
            padding-top: 0px;
            padding-left: 10px;
            padding-right: 10px;
            padding-bottom: 10px;
        }
        #item2
        {
            width: 580px;
            background-color: yellow;
            border: 1px ridge maroon;
            height: 100px;
            margin-top:10px;
        }
        #item1
        {
            width: 580px;
            background-color: orange;
            border: 1px ridge maroon;
            height: 550px;
            margin-top:10px;
        }
        .placeHolder
        {
            border: 2px dashed gray;
        }
    </style>
</head>
<body>
    <div id="dropZone">
        <div id="item1">Item 1</div>
        <div id="item2">Item 2</div>
    </div>
</body>
</html>
The second bug, if I apply the "sortable" to the same list (divs with
different height), and set the property tolerance like "pointer", when
I try to drag the small div over the big div, the placeholder don't
know were the div should be placed. There is the example:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/
TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Draggables Simple Example</title>
<script type="text/javascript" src="js/jquery-1.2.5.js"></script>
    <script src="js/ui.core.js"></script>
    <script src="js/ui.sortable.js"></script>
    <script src="js/ui.draggable.js"></script>
    <script src="js/ui.droppable.js"></script>
    <script type="text/javascript">
        window.onload = function()
        {
            $("#dropZone").sortable(
            {
                axis: 'y',
                containment: $("#dropZone"),
                scroll: true,
                helper: 'clone',
                revert: true,
                placeholder: 'placeHolder',
                tolerance: 'pointer'
            });
        }
    </script>
    <style type="text/css">
        #dropZone
        {
            width: 580px;
            background-color: #FFFFFF;
            border: 1px ridge maroon;
            padding-top: 0px;
            padding-left: 10px;
            padding-right: 10px;
            padding-bottom: 10px;
        }
        #item1
        {
            width: 580px;
            background-color: yellow;
            border: 1px ridge maroon;
            height: 100px;
            margin-top:10px;
        }
        #item2
        {
            width: 580px;
            background-color: orange;
            border: 1px ridge maroon;
            height: 300px;
            margin-top:10px;
        }
        .placeHolder
        {
            border: 2px dashed gray;
        }
    </style>
</head>
<body>
    <div id="dropZone">
        <div id="item1">Item 1</div>
        <div id="item2">Item 2</div>
    </div>
</body>
</html>
More one thing, when ever I drag a div, this moves 1px to the right,
it is a bug?
Sorry my english.