jQuery UI Диолог выполняет функцию после завершения шоу-эффекта

0

На данный момент я кодирую jQuery и jQueryUI. Я использую виджет диалогового окна jQuery. (jQuery API - Dialog Widget)

Я открываю диалог и использую для этого метод show, код выглядит примерно так:

$("#dialog").dialog({
    dialogClass: 'myclass',
    height: 'auto',
    width: 'auto',
    modal: true,
    resizable: false,
    draggable: false,
    buttons: [{ text: "Ok", click: function () { $(this).dialog("close"); } }],
    show: { effect: "slide", duration: 1000, direction: "right", finish: function () { $(".myclass.ui-dialog").css("position", "fixed"); console.log("done after effect"); } },
    position: { my: "right top", at: "right top", of: window },
});

Важная часть - это show: там. Все это работает, кроме параметра "finish". Есть ли способ добавить функцию после завершения этого эффекта?

Я просто хочу, чтобы мой диалог был исправлен, чтобы он оставался на своем месте, если вы прокручиваете. Я попытался перезаписать класс css, и он работает, но пока эффект запущен, дисплей сломан (отображается слева, а не справа), и сразу после него это правильно, поэтому я хотел попытаться добавить его после эффекта,

Итак, есть ли хороший способ?

Теги:
effect
jquery-ui-dialog

2 ответа

2
Лучший ответ

посмотрите здесь второй ответ, так как первый не работает больше

open: function () {
    $(this).parent().promise().done(function () {
        console.log("[#Dialog] Opened");
    });
}
Поделиться
  • 0
    Ваше решение работает с небольшой задержкой. (Я думаю, потому что он слушает событие?) Это что-то меньше секунды, но иногда слабое. Но это не должно быть проблемой для меня, ваш путь намного лучше (: Спасибо.
0

Ах, я нашел решение сам. Возможно, это всего лишь обходной путь, но он работает.

Я добавил параметр autoOpen: false, в диалог и добавил следующие строки при создании диалога:

$("#dialog").dialog('open');
$(".achievement_dialog.ui-dialog").wait(1000, function () { $(this).css("position", "fixed"); console.log("done after effect"); });

Метод wait() - это самокодированная функция jQuery i, созданная один раз для случаев ожидания функций:

$.fn.wait = function (timeout, callback) {
    /// <summary>
    ///     Timeout for animations or show/hide-effects. Put the functions that should be executed after it in the callback function,
    ///     if they are no animations (or the won't wait).
    /// </summary>
    /// <param name="timeout" type="int">Time in miliseconds to wait</param>
    /// <param name="callback" type="Function">A function to execute after the time</param>
    /// <returns type="jQuery" />
    if (typeof timeout == 'undefined')
        timeout = 1000;
    $(this).animate({ opacity: 1.0 }, timeout, callback);
    return this;
};

Это работает для меня, если я использую то же время ожидания, что и время анимации шоу. Но я посмотрю на ответ Джонни. это звучит еще лучше.

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню