CODEWITHSUNDEEP
jqueryjquery-uijquery-ui-sortable
HTMLGuy
HTMLGuy

Reputation: 241

jQuery UI .sortable very jumpy

I'm using nested sortables to create a UI editor. Basically similar to portlets I guess. The user picks up widgets or widget holders and can move them around the screen, then it saves. They are really jumpy and don't like to stick into certain spots. It almost seems like they prefer to be dragged top-down. I've tried adding padding to the holder and the widgets and it doesn't seem to make it any better. Does anyone know of a really good method of making this crap more accurate? I've tried almost everything I can find....I understand the issue (mostly), I just can't figure out a fix. One problem is when it snaps into a spot, something moves and sometimes what moves makes the layout change drastically and the placeholder jumps back and forth trying to settle. I don't understand why I can't get it to go to the top of a holder though...Here's my js:

  $(".widget_holder").sortable({
        distance: 30,
        revert: true,
        items: ".widget",
        opacity: .8,
        scroll: true, 
        scrollSensitivity: 100, 
        scrollSpeed: 100,
        handle: ".move_widget",
        dropOnEmpty: true,
        tolerance: "pointer",
        cursorAt: { top:0, left: 0 },
        start: function(e, ui){
        $(".widget_holder", ui.item).hide();
        $('.widget').addClass("drag_padding");
        $(".widget_holder" ).addClass("holder_hover").addClass("drag_padding").sortable("refresh");
        },
        update: function(e, ui){
        if(this === ui.item.parent()[0]) {
        updateByHolder();
        }
        },
        stop: function(e, ui){
        $(".widget_holder", ui.item).show();
        $('.widget').removeClass("drag_padding");
        $(".widget_holder" ).removeClass("holder_hover").removeClass("drag_padding");
        }
   }).sortable(
       "option", "connectWith", '.widget_holder' 
    );

Upvotes: 0

Views: 1404

Answers (2)

Webmaster G
Webmaster G

Reputation: 532

What about overflow: auto; to the parent (ul, #element_id, etc)?

Upvotes: 1

Riiich
Riiich

Reputation: 11

Try getting rid of tolerance: "pointer", or replace it with tolerance: "intersect",

Having pointer as the tolerance options makes the whole list very jumpy!

Upvotes: 1

Related Questions