AJAX ControlToolkit學習日誌-AlwaysVisibleControlExtender(2)

      今天早上學習了AlwaysVisibleControlExtender控制項，感覺還是不錯。下午就寫點東西，總結一下使用方法。
 
簡單使用樣本(顯示目前時間)
      1）在VS下，建立一個ASP.NET AJAX-Enabled Web Project項目，命名為AlwaysVisibleControlExtender。
      
      
      2 ）在頁面上拖放一個UpdatePanel控制項，並在UpdatePanel的ContentTemplate中拖放一個Panel和AlwaysVisibleControlExtender控制項。   
      

      3）把AlwaysVisibleControlExtender的TargetControlID設定為Panel的ID，並添加AlwaysVisibleControlExtender的一些屬性。代碼如下：
      

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

            屬性說明：
                  a.HorizontalOffset:設定目標控制項在水平方向的位移量，相對於水平邊緣方向。
                  b.HorizontalSide:設定目標控制項的水平邊緣的參考方向。
                  c.VertialOffset:設定目標控制項在垂直方向的位移量，相對於垂直邊緣方向。
                  d.VertialSide:設定目標控制項的垂直邊緣的參考方向。
                  e.TargetControlID:目標控制項的ID。
                  f.ScrollEffectDuration:目前不清楚該屬性具體作用，調整了Panel沒什麼反應。請大家指點。
      3）在Panel裡添加一個div標籤，用於顯示目前時間。代碼如下：<div id="currentTime" runat="Server" style="font-size:xx-large;font-weight:bold;line-height:40px;"></div>

      4）最後在頁面上加入一個Javascript函數，用於讀取目前時間，並在currentTime中顯示。
       

 1        <script type="text/javascript">
 2            function UpdateTime()
 3            {
 4                var label=document.getElementById('currentTime');
 5                if(label)
 6                {
 7                    var time=(new Date()).localeFormat("T");
 8                    label.innerHTML=time;
 9                }
10            }
11            UpdateTime();
12            window.setInterval(UpdateTime,1000);
13        </script>

      5)在頁面上點擊右鍵，選擇在瀏覽器裡查看。對該效果進行預覽。