jQuery: slideUp.delay.slideDown - отменить с помощью кнопки?

Question

Я не понимаю, почему это не сработает.

function notificationBoxOutput(type, message) {
    var noteBox = $('.notificationBox');

    noteBox.slideDown( function() {
        noteBox.delay(2500).slideUp();
    });
}

function notificationBoxCancel() {
        console.log('successfully fired');
    $('.notificationBox').slideUp();
}

Так что я вызываю функцию notificationBoxOutput, чтобы иметь вид строки состояния в верхней части экрана, которая дает некоторую обратную связь. Панель скользит вниз, держит 2,5 секунды, а затем скользит вверх.

Сама панель содержит маленькую иконку сближения, которая запускает notificationBoxCancel при нажатии Таким образом, у пользователя есть возможность закрыть панель даже быстрее, чем за 2,5 секунды. Однако ближе не работает. Консоль говорит «успешно сработал», но окно не выдвигается (). hide () работает! fadeOut () и slideUp () нет.

Есть идеи, почему?

Answer 1

Вы должны .stop() анимации, прежде чем скользить (их) вверх. Попробуйте что-то вроде этого:

function notificationBoxCancel() {
        console.log('successfully fired');
    $('.notificationBox').stop().slideUp();
}

Answer 2

Я думаю, это потому, что анимации стоят в очереди. Попробуйте позвонить stop до slideUp:

function notificationBoxCancel() {
        console.log('successfully fired');
    $('.notificationBox').stop(true,true).slideUp();
}