JQuery модальный диалог по iFrame

Я использую диалог jQuery UI для модальных всплывающих окон. У меня есть некоторые фреймы на моей странице. IFrame (z-Index = 1500) находится поверх родительской страницы (z-index = 1000). Я открываю модальный диалог с родительской страницы. Я пытаюсь установить z-index, используя диалог $('modal'). ('Option', 'zIndex', 3000); но это не работает. Я также попробовал стек: true (чтобы уложить его сверху) и .dialog('moveToTop'), но они, похоже, не работают.

Вот код: Родительская страница:

используя таблицу стилей: от "css/ui-darkness/jquery-ui-1.7.2.custom.css" используя скрипты: jquery-1.3.2.min.js && & & JQuery-UI-1.7.2.custom.min.js

<script type="text/javascript" language="javascript">

  function TestModal() {
    var modal = "<div id='modal'>Hello popup world</div>";
    $(modal).dialog({
      modal: true,
      title: 'Modal Popup',
      zIndex: 12000,  // settin it here works, but I want to set it at runtime instead of setting it at design time
      close: function() {
        setTimeout(TestModal, 5000);
        $(this).remove();
      }
    });

    $('modal').dialog('option', 'zIndex', 11000); // these dont work
    $('modal').dialog('moveToTop'); // these dont work
    $('modal').dialog('option', 'stack', true); // these dont work
  }
    /** Run with defaults **/
  $(document).ready(function() {

    TestModal();

  });

  </script>
<div>
 Hello  World
 <br />

</div>

<iframe src="blocker.htm" width="100%" height="100%" frameborder="0" scrolling="no" name="myInlineFrame" 
style="z-index:10000;background-color:Gray;position:absolute;top:0px;left:0px" ALLOWTRANSPARENCY="false">
</iframe>

iframe: blocker.htm

     .wrap {ширина: 100%; высота: 100%}

Я - фрейм, и я злой

Ответ 1

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

$(modal).dialog({ /* other properties */ , zIndex: $.maxZIndex()+ 1, })

Ответ 2

Как насчет

$('#modal').closest('div.ui-dialog').css('z-index', '3000')

jQuery UI Dialog отображает DIV с помощью ui-диалога класса и становится родителем вашего оригинального DIV, поэтому я использовал ближайший(), чтобы найти его (не ссылаясь на него напрямую по классу, если на странице больше диалогов).

Ответ 3

Вы попробовали $('modal').dialog('zIndex', 11000)?