我在购物页面上使用了可折叠面板扩展器。我用它来显示/隐藏特别优惠。包含这些的面板固定在页面底部。我有面板工作(扩展和收缩),但我需要更改面板以使其向下折叠而不是向上折叠。默认的折叠行为是向上折叠。这给我带来了一个问题,因为折叠面板后特价面板和页面底部之间存在间隙。
我的代码如下:
<!--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",或者如果无法更改折叠方向,则在折叠后将面板重新定位到屏幕底部。
谢谢!