asp.net 3.5 ajax 入门教程实例

以下是代码片段：

 <asp:Panel ID="Panel2" runat="server" Height="30px" CssClass="collapsePanelHeader">

    <div style="padding:5px; cursor: pointer; vertical-align: middle;">

                <div style="float: left; font-size:12px">What is ASP.NET AJAX?</div>

                <div style="float: left; margin-left: 20px;">

                    <asp:Label ID="Label1" runat="server" Font-Size="12px">(Show Details...)</asp:Label>

                </div>

                <div style="float: right; vertical-align: middle;">

                    <asp:ImageButton ID="Image1" runat="server" ImageUrl="~/images/expand_blue.jpg" AlternateText="(Show Details...)"/>

                </div>

            </div>

    </asp:Panel>

    <asp:Panel ID="Panel1" runat="server" Width="300px" Height="30px">

            <p>

                <asp:ImageButton ID="Image2" runat="server" ImageUrl="~/images/AJAX.gif"

                    AlternateText="ASP.NET AJAX" ImageAlign="right" />

                 ASP.NET AJAX is a free framework for building a new generation of richer, more interactive, highly personalized cross-browser web applications. This new web development technology from Microsoft integrates cross-browser client script libraries with the ASP.NET 2.0 server-based development framework. In addition, ASP.NET AJAX offers you the same type of development platform for client-based web pages that ASP.NET offers for server-based pages. And because ASP.NET AJAX is an extension of ASP.NET, it is fully integrated with server-based services. ASP.NET AJAX makes it possible to easily take advantage of AJAX techniques on the web and enables you to create ASP.NET pages with a rich, responsive UI and server communication. However, AJAX isn't just for ASP.NET. You can take advantage of the rich client framework to easily build client-centric web applications that integrate with any backend data provider and run on most modern browsers.

            </p>

        </asp:Panel>

以下是代码片段：

<cc1:CollapsiblePanelExtender ID="Panel1_CollapsiblePanelExtender"

        runat="server" Enabled="True" TargetControlID="Panel1" ExpandControlID="Panel2"

        CollapseControlID="Panel2"

        Collapsed="True"

        TextLabelID="Label1"

        ImageControlID="Image1"   

        ExpandedText="(Hide Details...)"

        CollapsedText="(Show Details...)"

        ExpandedImage="images/collapse_blue.jpg"

        CollapsedImage="~/images/expand_blue.jpg"

        SuppressPostBack="true"

        SkinID="CollapsiblePanelDemo">

    </cc1:CollapsiblePanelExtender>