Показать iframe в сообщении jQuery BlockUI? - PullRequest
1 голос
/ 19 апреля 2011

У меня есть страница, на которой, когда пользователь нажимает «Готово», в фоновом режиме вызывается несколько методов веб-службы, а затем, когда все успешно завершается, окно закрывается.Прямо сейчас я использую плагин Jquery BlockUI для отображения сообщения «Пожалуйста, подождите ...», и это прекрасно работает.Теперь я хочу отобразить небольшую анимацию GIF в этом сообщении (небольшой индикатор прогресса, чтобы сказать, что страница все еще выполняется).Следующие работы (вид):

$.blockUI({ message: '<br /><img src="CPSupport/SiteArt/progress.gif" alt="" /><br /><h3>Please wait...</h3>' });

.GIF отображается, но не анимируется, потому что форма отправляется сразу.Я знаю, что это можно решить с помощью AJAX, но я также читал, что вставка GIF в iframe также будет работать.Идея iframe показалась мне менее эффективной, если я смогу заставить ее работать так, как мне нужно.Вот что я сейчас пытаюсь:

$.blockUI({ message: '<br /> <iframe src="CPSupport/SiteArt/progress.gif" height="60px" width="60px" scrolling="no" frameborder="0" id="progressIframe" /><br /><h3>Please wait...</h3>' });

Однако сейчас я вообще не вижу ни GIF, ни iframe.Может кто-нибудь сказать мне, что я делаю неправильно, или если это будет работать?Мне просто нужен GIF для анимации в «сообщении» BlockUI, пока окно не закроется.

Большое спасибо заранее за любые советы / советы!-Lloyd

Ответы [ 2 ]

1 голос
/ 19 апреля 2011

Атрибут src указывает URL-адрес документа для отображения в iframe. То есть вам нужно показать веб-страницу, а не рисунок.

Создайте простую HTML-оболочку для вашего gif и загрузите ее в свой iframe. Теперь оберните внешний элемент DIV вокруг iframe. Наконец, вызовите все это, используя блокировку элемента: http://jquery.malsup.com/block/#element

1 голос
/ 19 апреля 2011

Можете ли вы установить <iframe> src в файл GIF? Вы должны сделать HTML-страницу с GIF внутри нее и показать, что ... Кроме того, я бы рекомендовал использовать ajax Vice в iframe:)

...