jquery對話框在動畫過程中顯示在div後面

Question

我不確定你們是否能夠只用這些信息來幫助我，但如果它不夠，只問我和我會提供。

我有一個使用動畫顯示的對話框。它創建於一切之上。我沒有使用任何自定義的z-index，只是正常的功能。

這是一個div，它在先前顯示的另一個對話框內。 在動畫過程中（「盲」），它顯示在它所在的對話框的後面，但最後通常顯示在該對話框的頂部。

我需要解決它在動畫期間在所有內容上顯示這個「子」對話框。

這是代碼：

$("#childDialog").dialog({ 
     autoOpen: false, 
     show: { 
      effect: "blind", 
      duration: 1000 
     }, 
     hide: { 
      effect: "blind", 
      duration: 1000 
     }, 
     position: { 
      my: "left top", 
      at: "left bottom", 
      of: "#isCertifiedAdd" 
     } 
    }); 

和HTML：

<div id='parentDialog'> 
    ... some html 
    <div id="childDialog"> 
     ... more html 
    </div> 
</div> 

感謝。調用

Answer 1

使用$('#childDialog').dialog('moveToTop')之前$('#childDialog').dialog('show')

HTML

<div id='parentDialog'> 
    <button id='button'>Open Child</button> 
    <div id='parentHtml'>... parent html</div> 
    <div id="childDialog"> 
     <div id='childHtml'>... child html</div> 
    </div> 
</div> 

JS

$('#parentDialog').dialog({ 
    height: 300, 
    width: 300 
}); 

$("#childDialog").dialog({ 
    autoOpen: false, 
    height: 300, 
    width: 300, 
    show: { 
     effect: "blind", 
     duration: 1000 
    }, 
    hide: { 
     effect: "blind", 
     duration: 1000 
    }, 
    position: { 
     my: "left top", 
     at: "left bottom", 
     of: "#parentHtml" 
    } 
}); 

$('#parentDialog').click(function() { 
    $('#childDialog').dialog('moveToTop'); 
    $('#childDialog').dialog('open'); 
    event.stopPropagation(); 
}); 

http://jsfiddle.net/DL5w9/