jqModal對話框總是在疊加層下

我有以下代碼，並且在我的機智端，因爲對話框總是出現在疊加層下面。任何建議將不勝感激：jqModal對話框總是在疊加層下

<head runat="server"> 
    <title></title> 
    <link href="../Styles/jqModal.css" rel="stylesheet" type="text/css" /> 
    <style type="text/css"> 
     #shift-edit-popup 
     { 
      display: none; 
     } 
    </style> 
    <script src="../Scripts/jquery-1.4.2.js" type="text/javascript"></script> 
    <script src="../Scripts/jqModal.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(function() { 
      $("#shift-edit-popup").jqm({ 
       toTop: true 
      }).jqmAddTrigger("#show-button"); 
     }); 
    </script> 
</head> 
<body> 
    <form id="form" runat="server"> 
    <input id="show-button" type="button" value="Show" /> 
    <div id="shift-edit-popup"> 
     <div> 
      <asp:Label ID="resourceLabel" runat="server" AssociatedControlID="resourceList">Resource:</asp:Label> 
      <asp:DropDownList ID="resourceList" runat="server" DataTextField="Name" DataValueField="ResourceId" Width="120px"> 
      </asp:DropDownList> 
     </div> 
    </div> 
</body>

來源

2010-04-30 ProfK

從我所看到，並試圖您需要使用包括在你的對話框的div jqmWindow類和降本：

<style type="text/css"> 
    #shift-edit-popup 
    { 
     display: none; 
    } 
</style>

您的代碼應該是這個樣子：

<head runat="server"> 
    <title></title> 
    <link href="Scripts/jqModal.css" rel="stylesheet" type="text/css" /> 

    <script src="Scripts/jquery-1.4.2.js" type="text/javascript"></script> 
    <script src="Scripts/jqModal.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(function() { 
      $("#shift-edit-popup").jqm({ 
       toTop: true, 
       modal: true 
      }).jqmAddTrigger("#show-button"); 
     }); 
    </script> 
</head> 
<body> 
    <form id="form" runat="server"> 
    <input id="show-button" type="button" value="Show" /> 
    <div id="shift-edit-popup" class="jqmWindow"> 
     <div> 
      Resource: 
      <select><option value="1">One</option><option value="2">Two</option></select> 
     </div> 
    </div> 
</body>

（你只需要改變腳本和CSS引用accordinly）

來源

2010-05-04 16:07:18

謝謝！這只是答案！ – ProfK 2010-05-08 09:35:02

檢查覆蓋和模態框的z-index值。

來源

2010-04-30 14:51:44 Pickle

我試過z-index值都小於和大於覆蓋無效。 – ProfK 2010-04-30 16:19:01

也許這將有助於閱讀：Understanding z-index

來源

2010-05-04 02:16:12 josh3736

謝謝，但jqModal應該照顧其目標元素上的z-index。 – ProfK 2010-05-04 11:13:15

我相信你需要設置移位編輯彈出的位置：

<style type="text/css"> 
    #shift-edit-popup 
    { 
     display: none; 
     position : relative; 
    } 
</style>

來源

2010-05-04 14:07:58 Pavlo

+1。我相信你有答案！ – 2010-05-04 20:47:12

你使用哪種版本jqModal.js的？

http://dev.iceburg.net/jquery/jqModal/的最新官方版本與jQuery 1.4.x不兼容（請參閱http://forum.jquery.com/topic/jqdnr-dragging-problem-with-jquery-1-4和http://www.trirand.com/blog/?page_id=393/bugs/jqgrid-jquery-1-4/）。

如果在您的版本中「$（）」存在於jqModal.js中，它應該替換爲「$（document）」。您也可以下載固定版本作爲jqGrid軟件包的一部分：http://www.trirand.com/blog/?page_id=6。

來源

2010-05-06 15:54:51 Oleg

啊，是的，我有最新版本，和jQuery 1.4.2。謝謝，我明天會跟進你的鏈接。 – ProfK 2010-05-06 18:32:52

不久之前我遇到了這樣的問題。嘗試將DOCTYPE更改爲：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

來源

2010-05-07 01:16:19 Superdumbell

jqModal對話框總是在疊加層下

回答

相關問題