AlwaysVisibleControlExtender

   今天早上学习了AlwaysVisibleControlExtender控件,感觉还是不错。下午就写点东西,总结一下使用方法。
 
简单使用示例(显示当前时间)
      1)在VS下,新建一个ASP.NET AJAX-Enabled Web Project项目,命名为AlwaysVisibleControlExtender。如图:
      
      
      2 )在页面上拖放一个UpdatePanel控件,并在UpdatePanel的ContentTemplate中拖放一个Panel和AlwaysVisibleControlExtender控件。如图:   
      

      3)把AlwaysVisibleControlExtender的TargetControlID设置为Panel的ID,并添加AlwaysVisibleControlExtender的一些属性。代码如下:
      

1 None.gif            <cc1:AlwaysVisibleControlExtender ID="AlwaysVisibleControlExtender1" HorizontalOffset="10" HorizontalSide="Right" VerticalOffset="10" VerticalSide="Top" TargetControlID="Panel1" ScrollEffectDuration=".1" runat="server">   
2 None.gif            </cc1:AlwaysVisibleControlExtender>

            属性说明:
                  a.HorizontalOffset:设置目标控件在水平方向的偏移量,相对于水平边缘方向。
                  b.HorizontalSide:设置目标控件的水平边缘的参考方向。
                  c.VertialOffset:设置目标控件在垂直方向的偏移量,相对于垂直边缘方向。
                  d.VertialSide:设置目标控件的垂直边缘的参考方向。
                  e.TargetControlID:目标控件的ID。
                  f.ScrollEffectDuration:目前不清楚该属性具体作用,调整了Panel没什么反应。请大家指点。
      3)在Panel里添加一个div标签,用于显示当前时间。代码如下:

None.gif<div id="currentTime" runat="Server" style="font-size:xx-large;font-weight:bold;line-height:40px;"></div>


      4)最后在页面上加入一个Javascript函数,用于读取当前时间,并在currentTime中显示。
       

 1 None.gif          < script type = " text/javascript " >
 2 None.gif             function  UpdateTime()
 3 ExpandedBlockStart.gifContractedBlock.gif             {
 4InBlock.gif                var label=document.getElementById('currentTime');
 5InBlock.gif                if(label)
 6ExpandedSubBlockStart.gifContractedSubBlock.gif                {
 7InBlock.gif                    var time=(new Date()).localeFormat("T");
 8InBlock.gif                    label.innerHTML=time;
 9ExpandedSubBlockEnd.gif                }

10ExpandedBlockEnd.gif            }

11 None.gif            UpdateTime();
12 None.gif            window.setInterval(UpdateTime, 1000 );
13 None.gif         </ script >


      5)在页面上点击右键,选择在浏览器里查看。对该效果进行预览。
      
      

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值