Как в JQuery Sortable как запустить функцию до запуска анимации возврата? - PullRequest
Новая
       2

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

2 голосов
/ 03 марта 2012

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

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

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

1 Ответ

3 голосов
/ 03 марта 2012

К сожалению, анимация возврата выполняется перед выполнением внутренней функции _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
});

DEMO

...