jqModal jQuery плагин - Как установить время ожидания модального всплывающего окна? - PullRequest
Новая
       20

jqModal jQuery плагин - Как установить время ожидания модального всплывающего окна?

1 голос
/ 27 июля 2010

Я использую плагин jQuery jqModal .

Новичок в этом, так что я все еще изучаю его использование.

Я пытаюсь показать всплывающее окно, скажем, 3 секунды, а затем автоматически закрыть.

По сути, вот поток событий, которые я хочу:

  1. Моя страница загружается.
  2. Показать модальное всплывающее окно «Соединение с MySite ..»
  3. (через 3 секунды) модальное всплывающее окно автоматически закрывается.
  4. Обновить страницу (window.location.reload ());

Вот что у меня есть (не так много):

HTML: 

<div id="jqPopupModal" style="display: none;">Connecting to My Site...</div>

JS: 

window.onload = function() {
   showPopup();
   window.location.reload();
}

function showPopup() {
   $('#jqPopupModal').jqm( { modal: true } );
   $('#jqPopupModal').jqmShow();
}

Есть ли какой-то аргумент, который я могу передать функции .jqmShow (), чтобы установить тайм-аут для окна? Или я должен подключиться к обратному вызову onShow и сделать простой setTimeout?

Было бы также неплохо, если бы шаги 2 и 4 выполнялись асинхронно: другими словами, страница обновляется, пока отображается всплывающее окно jQuery.

Есть идеи?

EDIT:

Хорошо, у меня работает задержка открытия / закрытия, но не с window.location.reload(). Положив это, не вызывает никаких задержек вообще.

Вот мой код: 

function fbcPopupOnShow() {{
                $('#fbcModalPopup').show();
                window.location.reload();
                window.setTimeout(new function() {{
                    $('#fbcModalPopup').jqmHide();

                }}, 1000);
            }}

            function showFacebookConnectPopup() {{
                $('#fbcModalPopup').jqm( {{ 
                    modal: true,
                    onShow: fbcPopupOnShow
                }});

                $('#fbcModalPopup').jqmShow();
            }}

Я надеялся, что window.location.reload() перезагрузит родительское окно, пока отображается всплывающее окно, а не одно или другое.

РЕДАКТИРОВАТЬ 2:

Выяснил, что не могу выполнить перезагрузку и всплывающее окно асинхронно, поскольку всплывающее окно jqModal на самом деле не является «всплывающим» (то есть, новое окно НЕ порождается). Это просто скрытый DIV.

Поэтому я только что изменил свой код для перезагрузки ПОСЛЕ того, как окно скрыто.

1 Ответ

2 голосов
/ 28 июля 2010

Используйте событие onShow, чтобы закрыть его после задержки (требуется jQuery 1.4+), в противном случае вы можете просто использовать тайм-ауты javascript, чтобы закрыть всплывающее окно. 

var autoClose = function(hash) { $('#jqPopupModal').delay(3000).jqmHide(); }; 
$('#jqPopupModal').jqm({ modal: true, onShow:autoClose});
...