Как открыть всплывающее расширение модели Ajax, как просмотрщик изображений Facebook? - PullRequest
0 голосов
/ 10 августа 2011

Я хочу использовать элемент управления ajax ModelpopupExtender на моей странице .aspx в visual studio 2010. Когда пользователь нажимает любую кнопку, он должен открывать всплывающее окно, как Facebook открывает всплывающее окно для отображения фотографий.Это означает, что всплывающее окно должно быть открыто таким образом, что оно должно отключить фон, пока не будет нажата закрытая кнопка этого всплывающего окна.Как открыть страницу или панель или любую другую вещь в этом всплывающем окне.Пожалуйста, укажите четкие шаги.Я даже понятия не имею, как это сделать?

Заранее спасибо ...

1 Ответ

0 голосов
/ 04 января 2012
<%@ Page Language="C#" AutoEventWireup="true"  
CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="AjaxControlToolkit" 
Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

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

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Ajax Model PopUp Extender With MouseOver Example</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript">

        function MouseHover() 
     {
         $find("modelPopupExtender1").show();
     }

    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
<ajaxToolkit:ToolkitScriptManager ID="toolKitScriptManager1" 
                                  runat="server">
</ajaxToolkit:ToolkitScriptManager>    
<p style="background-color: #9999FF; width: 95%;">

Example of using a ModalPopupExtender with with Mouse Over
<br/></p><br/>
Hover over the hyperlink 
<asp:HyperLink ID="HyperLink1" runat="server" 
               onmouseover="MouseHover();" 
               Font-Underline="True" ForeColor="Blue">
<b>Mouse Over Here to Open PopUp</b>
</asp:HyperLink> to open pop up

<ajaxToolkit:ModalPopupExtender runat="server" 
                   BehaviorID="modelPopupExtender1" 
                   TargetControlID="HyperLink1"
                   PopupControlID="popUpPanel" 
                   OkControlID="btnOk" 
                   BackgroundCssClass="modalBackground" >
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="popUpPanel" runat="server" 
           CssClass="confirm-dialog">
<div class="inner">
<h2>
Thanks For Visiting This Site</h2>
<div class="base">
<asp:Button ID="btnOk" runat="server" Text="Ok"/>
<asp:LinkButton ID="LinkButton1" runat="server" 
                CssClass="close" 
OnClientClick="$find('modelPopupExtender1').hide(); return false;"/>
</div></div>
</asp:Panel>



    </div>
    </form>
</body>
</html>

BackgroundCssClass = "modalBackground" вы заметили эту строку, здесь вы определяете CSS для фона.

Я думаю, что это должно работать.
Ссылка

...