В JQuery Sortable, как я могу запустить функцию до запуска анимации возврата?

Пример сортируемого фрагмента JQuery:

 $("#sortable").sortable({ 
     start: function(){ $('#overlay').show('fast'); });
     stop: function(){ $('#overlay').hide('fast'); });
     revert: true;
 });

Я хочу, чтобы мой оверлей по крайней мере начал скрываться ДО того, как начнется анимация возврата, потому что в противном случае он кажется медленным. Любые идеи?


jquery-ui jquery-ui-sortable
person adamdport    schedule 02.03.2012    source источник

Ответы (1)


arrow_upward
3
arrow_downward

К сожалению, анимация возврата выполняется до выполнения внутренней функции _clear(), которая запускает события beforeStop и stop.

Возможный обходной путь — указать число для параметра revert вместо логического значения. Из документации:

Если установлено значение true, элемент будет возвращен в новую позицию DOM с плавной анимацией. При желании можно также установить число, определяющее продолжительность анимации в мс.

Таким образом, вы можете установить меньшую продолжительность анимации возврата, например 150 мс, чтобы она не выглядела слишком медленной:

$("#sortable").sortable({ 
     start: function(){ $('#overlay').show('fast'); },
     stop: function(){ $('#overlay').hide('fast'); },
     revert: 150
});

Кроме того, вы можете заменить событие stop, определив определение одноразового события mouseup в помощнике, когда вы начинаете перетаскивание, в котором вы начнете скрывать свой элемент #overlay. Как только кнопка мыши будет отпущена, обработчик будет выполнен вместе с анимацией возврата:

$("#sortable").sortable({ 
     start: function(){
         // set a one-time "mouseup" event on the helper
         $(ui.helper).one('mouseup', function() {
             // when mouse button is released, "#overlay" will start hiding
             // along with reverting animation
             $('#overlay').hide('fast');
         });
         $('#overlay').show('fast'); 
     },
     revert: 150
});

ДЕМО

person Didier Ghys    schedule 03.03.2012
comment
Мне понравилась более медленная анимация возврата, но ваш трюк с мышью — это именно то, что я искал. Все кажется очевидным, как только вы это увидите :-) Спасибо за ваше дополнительное время в создании jfiddle для меня!! - person adamdport; 05.03.2012
comment
Ну, я пришел первым с анимацией возврата, это был скорее трюк, заставил меня подумать о фактическом решении при создании скрипки. Рад, что помогло! - person Didier Ghys; 05.03.2012