Jquery UI - Sortable & Draggable revert speed_问答_开发者

Jquery UI - Sortable & Draggable revert speed

开发者 https://www.devze.com 2023-01-11 12:18 出处：网络

i have a problem with the revert speed. Here开发者_JS百科 is a working example http://www.jsfiddle.net/V9Euk/94/<-- updated

i have a problem with the revert speed.

Here开发者_JS百科 is a working example http://www.jsfiddle.net/V9Euk/94/ <-- updated

Change something in the sortable list ... the speed is fast (revert 100). But when you drop the "four" into the sortable list, the speed is slow.

But why? oO

kind reagards Peter

There's nothing wrong with the code... except that it was invalid. You had a incorrectly closed tag, and other oddities inside the code that once cleaned up resolved the problem. I think. Unless it isn't what you was asking about.

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>
    </head>

    <body>
        <ul id="k1" style="width:350px; height:350px; margin:20px;">
            <li>One</li>
            <li>Two</li>
            <li>Three</li>
        </ul>
        <hr />
        <ul style="width:350px; height:350px;">
            <li class="gt">Four</li>
        </ul>
    </body>
</html>

CSS:

body {
    font-size: 12px;
}

li{
    border:1px solid #444444;
    background-color:#AAAAAA;
    padding:10px;
    margin:10px;
}

jQuery:

$("#k1").sortable({   revert: '100'  });
$('.gt').draggable({ connectToSortable: '#k1', revert: 'invalid', revertDuration: 100 });

Edit: Sorry, I misread the question. The code was slightly confusing, and I missed the problem. The solution is a little bit of a kludge, but I think it will work.

var original = $('#k1');

original.sortable({ revert: 100  });
$('.gt').draggable({
    connectToSortable: original,
    revert: 'valid',
    revertDuration: 100,
    stop: function(event, ui) {
        original.sortable("option", "revert", 100);
    }
});

Basically it re-set the revert option on the k1 div after .gt is dropped.

Now you can achieve this with :