AJax学习之实现CollapsiblePanel下拉面板, 中间为repeater

注意事项: 第二个面板的DIV标签中需要加上clear:both; 

<div> 
    <div>
    <asp:Panel ID="Panel2" runat="server">
        <div style="padding-top:8px; padding-left:10px; padding-bottom:5px; cursor: pointer; vertical-align: middle;"  class="blueTitle"> 
                 <div style="display:inline; float:left;"><asp:Image ID="Image3" runat="server" ImageAlign="AbsMiddle" 
                ImageUrl="~/Images/Announce.png" />Announcement (<asp:Label ID="lbAnnounceCount" runat="server" Text=""></asp:Label>)
                </div>
                <div style="float:right; display:inline; vertical-align: middle; margin-top:-5px; margin-right:5px;"><asp:Image ID="ShowOrHideImge" runat="server" ImageUrl="~/Images/expand.png"/></div>
                <div style="float:right; display:inline; vertical-align: middle;"><asp:Label ID="lbHint" runat="server" Text=""></asp:Label></div>
        </div>       
    </asp:Panel>
    </div>
    <div style="clear:both;">
        <asp:Panel ID="Panel1" runat="server">
            <asp:Repeater ID="rptComments" runat="server" >                               
                    <ItemTemplate> 
                        <div style="padding-left: 5px; padding-right: 5px;">
                            <div class="announceLabel">Announced By: 
                                <asp:Label ID="lblPostBy" runat="server"><%#DataBinder.Eval(Container.DataItem, "FullName")%></asp:Label>
                                <i>[<asp:Label ID="lblPostDate" runat="server"><%#DataBinder.Eval(Container.DataItem, "CreateDate")%></asp:Label>]</i>        
                            </div>   
                             <div class="announcementTitle">
                                <asp:Label ID="Label1" runat="server"><%#DataBinder.Eval(Container.DataItem, "AnnounceTitle")%></asp:Label>                                                 
                            </div>
                            <div class="announcement">
                                <asp:Label ID="Label2" runat="server"><%#DataBinder.Eval(Container.DataItem, "Announcement")%></asp:Label>                                                 
                            </div>
                        </div>
                    </ItemTemplate>   
                    <SeparatorTemplate><hr width="98%" align="center" /></SeparatorTemplate>                                    
            </asp:Repeater>                      
    </asp:Panel>
    </div>        
        <asp:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server" 　　
    TargetControlID="Panel1"　　　　　　
    ExpandControlID="Panel2"　　　　　　
    CollapseControlID="Panel2"　　　　　　
    Collapsed="True"　　　
    ImageControlID="ShowOrHideImge"　　　　　　
    ExpandedImage="~/Images/collapse.png"　　　　　　
    CollapsedImage="~/Images/expand.png"　
    TextLabelID="lbHint"  
    ExpandedText="Click to Collapse"
    CollapsedText="Click to Expand"
    SuppressPostBack="true" />
</div> 

效果图: