Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery UI Sortable Window Scroll

I'm using jquery ui sortable. Without window scroll my sortable items works and stay in the containment. But if I scroll the window and I start sortable the items, my items move first to the same height of my window scroll and not stick anymore to my mouse pointer !!! What I did wrong ?

    var purchased = [];
$("#listitems").sortable({
    revert: true,
    containment: '#drop',
    stop: function(event, ui) { 
        purchased = [];
        $("#listitems li").each(function () {
            var elem = $(this);
            var st = elem.attr('id');
            if (jQuery.inArray(st, purchased) == -1) {
                purchased.push(st);
            }
        });
        console.log(purchased);
    }
});

    <div id="drop" class="clearfix" style="position:relative;margin:0 auto;min-height:160px;height:auto!important;height:160px;;margin-bottom:20px; border-top:1px solid #D4D4D4;border-bottom:1px solid #DADADA">
        <div style="position:absolute;top:-31px;left:10px; z-index:0"><h1 id="depose" style="font-size:2.6em; line-height:1em; color:#EBEBEB; font-weight:700; z-index:0">DRAG HERE</h1></div>
        <ul id="listitems" style="position:relative;z-index:11" class="alt_content galerie-thumbs">
<li>image 1</li>
<li>image 2</li>
...
        </ul>
    </div>

Thanks for your help...

like image 913
Chris Avatar asked Mar 07 '26 11:03

Chris


1 Answers

add a overflow: auto; to the parent / container of your list.

like image 70
Webmaster G Avatar answered Mar 10 '26 01:03

Webmaster G