jQuery ждать завершения действия для разных функций

Question

Я создал ленту новостей. Питание переключается каждые 2 секунды. Вы также можете вручную переключаться влево/вправо или щелкнуть панель с квадратов внизу. Переключение между слайдами отключается с помощью jQuery UI Slide.

Прямо сейчас, если вы находитесь в середине слайда, и вы нажимаете налево/вправо/квадраты, тогда еще один слайд появляется поверх существующего, все еще идущего слайда, и вся система перепутана.

Как предотвратить другие действия, если слайд/переключатель уже выполняется?

Это мой код:

$(document).ready(function(){ 
    newsfeedTimer = setInterval(newsfeed, displayDuration); 

    // Manual change of feed (LEFT) 
    $('#newsfeeds_wrapper > .left').click(function(event){ 
     event.stopPropagation(); 
     feedLeft(); 
     clearInterval(newsfeedTimer); 
     newsfeedTimer = setInterval(newsfeed, displayDuration); 
    }); 
    // Very similar code for feed right 
    // Ignore the other method of switching (if it works for above, I can implement it for this one) 

}); 

function newsfeed() { 
    feedRight(); 
} 
// Feed to the Right 
// jump is used to jump multiple newsfeed instead of one at a time 
function feedRight(jump) 
{ 
    jump = typeof jump !== 'undefined' ? jump : 1; 
    var current = $('.newsfeed:first'); 
    var next = $('.newsfeed:nth(' + jump + ')'); 
    current.hide('slide',{duration: transitionDuration}, function(){ 
    // Append as many needed 
    for(var i = 0; i < jump; i++) { 
     $('.newsfeed:first').appendTo('#newsfeeds'); 
    } 
    next.show('slide',{direction : 'right' , duration: transitionDuration});  
} 

Я не хочу stop() анимацию! Я хочу отключить изменение слайдов, если происходит анимация!

Answer 1

, не видя полной ширины кода, я сам стреляю в ногу. Но вот направление, которое я возьму. У вас также могут быть две функции: одна для привязки, другая - для развязывания. Когда анимация инициируется, вы отвязываете элементы управления влево/вправо. Когда вы остановились, вы связываетесь. Или, установите глобальную переменную ... ala.

var config = {'inProgress': false}; 
$('#newsfeeds_wrapper > .left').click(function(event){ 
    if(!config.inProgress){ 
     event.stopPropagation(); 
     feedLeft(); 
     clearInterval(newsfeedTimer); 
     newsfeedTimer = setInterval(newsfeed, displayDuration); 
    } 
}); 

в вашей анимации функция. Похоже, когда вы вырезаете/вставляете, некоторые из кода теряются, поэтому давайте просто предположим некоторую анимацию.

Когда вы вводите свои функции анимации, задайте config.inProgress = true;

function feedRight(jump) 
{ 
    config.inProgress = true; 
    // removed your code, but just using for simplicity sake 
    // added a callback 
    next.show('slide',{direction : 'right' , duration: transitionDuration}, 
     function() { 
     // Animation complete. Set inProgress to false 
     config.inProgress = false; 
     }); 
    ) 
}