一、AlwaysVisibleControl 属性
TargetControlID – 控件的ID
HorizontalOffset – 控件距离浏览器的水平边距. 默认是0px。
HorizontalSide - 水平停靠方向。可选择(Left, Center, or Right)。默认是Left
VerticalOffset -控件距离浏览器的垂直边距. 默认是0px。
VerticalSide -垂直停靠方向。可选择(Top, Middle, or Bottom)。默认是Top。
ScrollEffectDuration – 控件复位时间,默认时间是0.1,单位是秒。
二、AlwaysVisibleControl控件的使用实例。
a、新建Ajax Web窗体,将其命名为AlwaysVisibleControl.aspx。
b、在所创建的页面上拖放一个panel控件,以存放当前时间,代码如下:
<asp:Panel ID="Panel1" runat="server" Width="250px" BackColor="White" ForeColor="DarkBlue"
BorderWidth="2" BorderStyle="solid" BorderColor="DarkBlue" style="z-index: 1;">
<div style="width: 100%; height: 100%; vertical-align: middle; text-align: center;">
当前时间:
<div id="currentTime" style="font-size:xx-large;font-weight:bold;line-height:40px;"><%=DateTime.Now.ToString() %>
</div>
</div>
</asp:Panel>
c、为该panel控件添加扩展程序,也就是AlwaysVisibleControl控件。
添加完扩展程序后,在源代码页面就会添加AlwaysVisibleControl控件的代码,并设置其相关的属性。
<cc1:AlwaysVisibleControlExtender ID="Panel1_AlwaysVisibleControlExtender"
runat="server" Enabled="True" TargetControlID="Panel1" VerticalSide="Top"
VerticalOffset="100"
HorizontalSide="Right"
HorizontalOffset="100"
ScrollEffectDuration="1">
</cc1:AlwaysVisibleControlExtender>
d、我们为panel控件和设置相关的css样式,最终代码如下:
<asp:Panel ID="Panel1" runat="server" Width="250px" BackColor="White" ForeColor="DarkBlue"
BorderWidth="2" BorderStyle="solid" BorderColor="DarkBlue" style="z-index: 1;">
<div style="width: 100%; height: 100%; vertical-align: middle; text-align: center;">
当前时间:
<div id="currentTime" style="font-size:xx-large;font-weight:bold;line-height:40px;"><%=DateTime.Now.ToString() %>
</div>
</div>
</asp:Panel>
<cc1:AlwaysVisibleControlExtender ID="Panel1_AlwaysVisibleControlExtender"
runat="server" Enabled="True" TargetControlID="Panel1" VerticalSide="Top"
VerticalOffset="100"
HorizontalSide="Right"
HorizontalOffset="100"
ScrollEffectDuration="1">
</cc1:AlwaysVisibleControlExtender>
</div>
e、效果预览
1、页面打开时,时间显示在左上
2、向下拉动右侧滚动条