TBS Dropdown Overflow Problem

HTML

<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<script src="http://cleesh.org/js/jquery.dragsort-0.4.min.js"></script>
<ul id="list1">
    <li>
        <div>1</div>
    </li>
    <li>
        <div>2</div>
    </li>
    <li>
        <div>3</div>
    </li>
    <li>
        <div>4</div>
    </li>
    <li>
        <div>5</div>
    </li>
    <li>
        <div>6</div>
    </li>
    <li>
        <div>7</div>
    </li>
    <li>
        <div>8</div>
    </li>
    <li>
        <div>9</div>
    </li>
</ul>

CSS

h1 {
    font-size:16pt;
}
h2 {
    font-size:13pt;
}
ul {
    margin:0px;
    padding:0px;
    margin-left:20px;
    overflow: auto
}
#list1 {
    list-style-type:none;
    margin:0px;
    white-space: nowrap;
    width: 100%;
}
#list1 li {
    padding:5px;
    width:100px;
    height:100px;
    display: inline-block;
}
#list1 div {
    width:90px;
    height:50px;
    border:solid 1px black;
    background-color:#E0E0E0;
    text-align:center;
    padding-top:40px;
}

JavaScript

$("#list1, #list2").dragsort({
    dragSelector: "div",
    dragBetween: true,
    dragEnd: saveOrder,
    placeHolderTemplate: "<li class='placeHolder'><div></div></li>"
});

var onDrag = false;
var $list = $("#list1");
var dimensoesList = {
    posicao: $list.position().left,
    largura: $list.width()
};

function mousePressed(e) {
    onDrag = e.type == 'mousedown' ? true : false;;
}
$('#list1 li').on('mousedown', mousePressed);
$('#list1 li').on('mouseup', mousePressed);

$('#list1 li').mousemove(function (e) {
    if (!onDrag) return;
    var posicaoMouse = e.clientX;
    if (posicaoMouse < dimensoesList.posicao + 100) {
        $list.stop().animate({
            scrollLeft: dimensoesList.posicao
        }, 200);
    }
    if (posicaoMouse > dimensoesList.largura - 100) {
        $list.stop().animate({
            scrollLeft: dimensoesList.largura
        }, 200);
    }
});

function saveOrder() {
    var data = $("#list1 li").map(function () {
        return $(this).children().html();
    }).get();
    $("input[name=list1SortOrder]").val(data.join("|"));
};