我該如何製作Modal Popup Extender Modal？（禁用背景）

我添加了一個簡單的ajax模式彈出式擴展器到我的asp.net應用程序。我該如何製作Modal Popup Extender Modal？（禁用背景）

它出現並正常工作，但不像ajax toolkit網站上的示例，它不會禁用/調暗頁面的其餘部分。我需要做些什麼才能達到這個效果？

<asp:Button ID="btnSaveAndClose" runat="server" Text="Save" 
       onclick="btnSaveAndClose_Click"/> 

       <cc1:ModalPopupExtender 
       BackgroundCssClass="modalBackground" 
       DropShadow="true" 
       OkControlID="btnOk" 
       CancelControlID="btnOk" 
       runat="server" 
       PopupControlID="pnlClientSaved" 
       id="ModalPopupExtender1" 
       TargetControlID="btnSaveAndClose" 
       /> 

<asp:Panel ID="pnlClientSaved" runat="server" CssClass="modalPopup" style="display:none;" Width="300px" Height="200px"> 
Client Saved! 
<br /><br /> 
<asp:Button ID="btnOk" runat="server" Text="Ok" /> 
</asp:Panel>

來源

2009-10-13 NibblyPig

您應該在「modalBackground」css類中編寫適當的樣式。相應的屬性在你的代碼已經被設置：

BackgroundCssClass="modalBackground"

下面是這個類的清單example page：

.modalBackground 
{ 
    background-color:Gray; 
    opacity:0.7; 
}

來源

2009-10-13 10:43:57 Restuta

乾杯，我不明白這是如何禁用背景，但不知何故它做到了。謝謝。 – NibblyPig 2009-10-13 10:51:40

不客氣！他們只是添加了另一個div，這個CSS類覆蓋了所有內容。 – Restuta 2009-10-13 10:55:46

.modalBackground 
{ 
    background-color:Gray ; 
    filter:alpha(opacity=30); 

}

來源

2011-12-07 07:50:27

請告訴我爲什麼你會在兩年前給出（並接受）的完全相同的答案來回答一個問題？！ – mbinette 2012-11-05 01:37:26

答案不會的背景下，這IMO是停止滾動true 禁用背景。

我做到了用這個...

包裝你的ContentPlaceHolder在<DIV id="wrapper">

而在你的主體使用jQuery ...，使用這個代碼在你的對象引用的CSS類。

所以CSSClass="popupOK"在您的標籤或控制裏面的modalpopupetentender和CSSClass="promoVisible"在你的確定或取消按鈕，應該刪除彈出。

$(document).ready(function() { 
    //had to set position:fixed to work on iPad and other mobile  
    $('.popupOk').click(function(){ 
     $('#wrapper').css('overflow', 'auto'); 
     $('#wrapper').css('position', 'inherit'); 
     // alert("ok clicked"); 
    }); 
    // if the popup is visible, fix the overflow so the 
    // background doesn't scroll, only the popup window 
    if($('.promoVisible').is(':visible')){ 
     $('#wrapper').css('overflow', 'hidden'); 
     $('#wrapper').css('position', 'fixed'); 
    } else{ 
     $('#wrapper').css('overflow', 'auto'); 
     $('#wrapper').css('position', 'inherit'); 
    } 
)}

來源

2016-10-17 05:09:06 Fandango68

我該如何製作Modal Popup Extender Modal？ （禁用背景）

回答

相關問題

我該如何製作Modal Popup Extender Modal？（禁用背景）