Sto utilizzando la finestra di dialogo dell'interfaccia utente jQuery per i popup modali. Ho anche alcuni iframe nella mia pagina. L'iFrame (z-Index = 1500) si trova in cima alla pagina padre (z-index = 1000). Apro la finestra di dialogo modale dalla pagina padre. Sto cercando di impostare lo z-index usando $ ('modal'). Dialog ('option', 'zIndex', 3000); ma questo non funziona Ho anche provato lo stack: true (per impilarlo in cima) e .dialog ('moveToTop'), ma non sembrano funzionare.jQuery Dialogo modale su iFrame
Ecco il codice: pagina padre :
utilizzando foglio di stile: da "css/ui-buio/jquery-ui-1.7.2.custom.css" utilizzando script: 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 {width: 100%; height: 100%}
Sono un iframe e io sono il male
aggiornamento: le 2 soluzioni fornite non hanno funzionato. Sto usando http://www.west-wind.com/weblog/posts/876332.aspx per trovare il massimo Z-index in modo dinamico e quindi assegnarlo in fase di progettazione qualcosa come $ (modale) .dialog ({/ * altre proprietà * /, zIndex: $ .maxZIndex() + 1,}) – ram