AJAX ControlToolkit学习日志-DragPanel(8)
DragPanel控件用于实现在网页上拖动一个面板，对它的位置进行从新的安排。
下面来看一个示例：
1)新建一个ASP.NET AJAX-Enabled Web Project的工程项目，命名为DragPanel1。
2)在页面上拖放三个Panel，分别命名为DragHandlePanel，Content和DragPanel。DragHandlePanel作为拖的事件处理，Content作为存放内容，DragPanel整个作为DragPanelExtender的目标对象。代码如下：
3)在页面上拖放一个DragPanelExtender，设置它的一些属性。代码如下：
<cc1:DragPanelExtender ID="DragPanelExtender1" TargetControlID="DragPanel" DragHandleID="DragHandlePanel" runat="server"></cc1:DragPanelExtender>
视图如下：
4)按下CTRL+F5，在浏览器中查看。效果如下：
下面来看一个示例：
1)新建一个ASP.NET AJAX-Enabled Web Project的工程项目，命名为DragPanel1。
2)在页面上拖放三个Panel，分别命名为DragHandlePanel，Content和DragPanel。DragHandlePanel作为拖的事件处理，Content作为存放内容，DragPanel整个作为DragPanelExtender的目标对象。代码如下：
1 <div style="Height:300px;Width:150px;">
2 <asp:Panel ID="DragPanel" runat="server">
3 <asp:Panel ID="DragHandlePanel" Height="20px" Width="100%" runat="server">
4 <div class="dragMe">Drag Me</div>
5 </asp:Panel>
6 <asp:Panel ID="Content" Height="100px" Width="100%" runat="server">
7 <div>fjeofjioefjojefiefef</div>
8 </asp:Panel>
9 </asp:Panel>
10
11 </div>
<div style="Height:300px;Width:150px;">2
<asp:Panel ID="DragPanel" runat="server">3
<asp:Panel ID="DragHandlePanel" Height="20px" Width="100%" runat="server">4
<div class="dragMe">Drag Me</div>5
</asp:Panel>6
<asp:Panel ID="Content" Height="100px" Width="100%" runat="server">7
<div>fjeofjioefjojefiefef</div>8
</asp:Panel>9
</asp:Panel>10
11
</div>3)在页面上拖放一个DragPanelExtender，设置它的一些属性。代码如下：
<cc1:DragPanelExtender ID="DragPanelExtender1" TargetControlID="DragPanel" DragHandleID="DragHandlePanel" runat="server"></cc1:DragPanelExtender>视图如下：
4)按下CTRL+F5，在浏览器中查看。效果如下：
