altas(ajax)控件(九)：可拖动面板DragPanel

使用非常简单：

             < asp:Panel  ID ="Panel6"  runat ="server"  Width ="250px"  style ="z-index: 20;" >
                 < asp:Panel  ID ="Panel7"  runat ="server"  Width ="100%"  Height ="20px"
                    BorderStyle ="Solid"  BorderWidth ="2px"  BorderColor ="black" >
                         < div  class ="dragMe" > 用鼠标拖动 </ div >
                 </ asp:Panel >
                 < asp:Panel   ID ="Panel8"  runat ="server"  Width ="100%"  Height ="250px"
                    Style ="overflow: scroll;"  BackColor ="#0B3D73"  ForeColor ="whitesmoke"
                    BorderWidth ="2px"  BorderColor ="black"  BorderStyle ="Solid"   >
                         < div >
                             < p > This panel will reset its position on a postback or page refresh. </ p >
                             < hr  />
                             < p > <% =  GetContentFillerText()  %> </ p >
                         </ div >
                 </ asp:Panel >
             </ asp:Panel >
         < ajaxToolkit:DragPanelExtender  ID ="DragPanelExtender1"  runat ="server"
            TargetControlID ="Panel6"
            DragHandleID ="Panel7"   />

 

 

·                  TargetControlID – 指定可以拖动的面板的 ID

·                  DragHandleID – 指定一个 ID ，作为拖动面板的标题栏。

 

效果如下：http://www.asp.net/AJAX/Control-Toolkit/Live/DragPanel/DragPanel.aspx