[jQuery] jCarousel Lite + two jQuery UI Draggable UL's = almost...

[Carl]

What I want to do is be able to drag and drop <li>'s between two divs,
and be able scroll the contents of those two divs.  There are a few
issues:

If I have circular on jCarousel, after dragging a li from the withhold
box to the release, another copy of that li is still in the withhold
ul if I scroll through previous and next.... circular: false makes
much more sense anyways so that is what I'm using.

1)  The height of the container (div and/or ul) is calculated by the
height and number of list items in it when the page is rendered.  So
if "releaseID" is empty, I can't drag anything in it. If I put in
placeholder list items then the height of the container is still a set
number of list items and it won't display any beyond that.

Ideally I'd want some way to make the container height equal to the
combined height of all list items in the two different uls.  A less
ideal solution would be to just pass the height of the tallest ul to
the other.

2)  A more cosmetic note, list items dragged out of one container
appear behind the target container (but once dropped are properly "on
top" of it).  I can mess with z-index etc, haven't done too much with
this yet.

html (contents of li's taken out, simplified slightly):

<div id="sortable-ex">

        <button class="prevW">^^</button>
        <button class="nextW">vv</button>

        <h3>Cards that won't be Released:</h3>
        <div class="withholdBox">
            <ul id="withholdID">
                        <li>asdf1</li>
                        <li>asdf2</li>
                        <li>asdf3</li>
                        <li>asdf4</li>
            </ul>
        </div>

        <button class="prevR">^^</button>
        <button class="nextR">vv</button

        <h3>Cards to be Released to this Site:</h3>
        <div class="releaseBox">
            <ul id="releaseID">

            </ul>
        </div>

   <br style="clear: both;" />
</div>

jQuery functions:

// CAROUSEL

$(function() {
    $(".withholdBox").jCarouselLite({
        btnNext: ".nextW",
        btnPrev: ".prevW",
                vertical: true,
                visible: 3,
                circular: false
    });
});

$(function() {
    $(".releaseBox").jCarouselLite({
        btnNext: ".nextR",
        btnPrev: ".prevR",
                vertical: true,
                visible: 3,
                circular: false
    });
});


// DRAG & DROP

$(document).ready(function(){
        $("#releaseID").sortable({
            connectWith: ["#withholdID"]
        });

        $("#withholdID").sortable({
            connectWith: ["#releaseID"]
        });
});

Carl