ModalPopupExtender Example
CSS
Let’s make a nice see thru background:
.modalBackground
{
background-color:#CCCCFF;
filter:alpha(opacity=40);
opacity:0.5;
}
The position should be -1000px, so during loading you not gonna see popup initialization.
.ModalWindow
{
border: solid1px#c0c0c0;
background:#f0f0f0;
padding: 0px10px10px10px;
position:absolute;
top:-1000px;
}
ASPX
<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
TargetControlID="lnkPopup"
PopupControlID="panEdit"
BackgroundCssClass="modalBackground"
CancelControlID="btnCancel"
PopupDragHandleControlID="panEdit">
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="panEdit" runat="server" Height="180px" Width="400px" CssClass="ModalWindow">
<h1>Edit/h1>
<table width="100%">
<tr>
<td class="formtext" style="height: 23px; width: 150px;" align="left">
Fields1:
</td>
<td>
<asp:TextBox ID="txtFields1" runat="server"></asp:TextBox>
</td>
</tr>
</table>
<br />
<asp:Button ID="Button1" runat="server" Text="Update" OnClick="btnUpdate_Click"/>
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
</asp:Panel>
<a id="lnkPopup" runat="server">Show Popup</a>
Posted on March 17, 2008 by Viktar Karpach
It should work in IE 6.0 as well. You probably have modalpopup panel in some kind of div container, which has style position equal to absolute or relative.
