1

我在购物页面上使用了可折叠面板扩展器。我用它来显示/隐藏特别优惠。包含这些的面板固定在页面底部。我有面板工作(扩展和收缩),但我需要更改面板以使其向下折叠而不是向上折叠。默认的折叠行为是向上折叠。这给我带来了一个问题,因为折叠面板后特价面板和页面底部之间存在间隙。

我的代码如下:

<!--teaser panel-->
    <asp:UpdatePanel ID="upTeaser" runat="server" UpdateMode="Conditional">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="lbShowHideTeaserPanel" EventName="Click"/>
        </Triggers>
        <ContentTemplate>
            <asp:AlwaysVisibleControlExtender ID="AlwaysVisibleControlExtender1" runat="server"
             TargetControlID="pnlTeaserContainer" 
             VerticalSide="Bottom" 
             HorizontalSide="Center"
             ScrollEffectDuration=".1"
             >
            </asp:AlwaysVisibleControlExtender>
            <asp:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server" CollapseControlID="lbShowHideTeaserPanel"
                CollapsedText="[+] Show Special Offers" ExpandControlID="lbShowHideTeaserPanel"
                ExpandedText="[-] Hide Special Offers" TargetControlID="pnlTeaserContent" TextLabelID="lbShowHideTeaserPanel"
                SuppressPostBack="true" >
            </asp:CollapsiblePanelExtender>
            <asp:Panel ID="pnlTeaserContainer" runat="server" CssClass="teaserContainer">
                <asp:Panel ID="pnlTeaserCollapser" runat="server">
                    <div style="text-align:right;">
                        <asp:LinkButton ID="lbShowHideTeaserPanel" runat="server" 
                        OnClick="lbShowHideTeaserPanel_Click"  
                        Text="[-] Hide Special Offers" style="color:#ff761b;" ></asp:LinkButton>
                    </div>
                </asp:Panel>
                <asp:Panel ID="pnlTeaserContent" runat="server" Visible="true">
                    <asp:Literal ID="litTeaserText" runat="server"></asp:Literal>
                </asp:Panel>
            </asp:Panel>
        </ContentTemplate>
    </asp:UpdatePanel>
    <!--end teaser panel-->

基本上我需要做的是防止面板向上塌陷后出现间隙;类似于“CollapseDirection="up",或者如果无法更改折叠方向,则在折叠后将面板重新定位到屏幕底部。

谢谢!

4

0 回答 0