第十四篇: Ajax Control Toolkit 控件包--3. DragPanel (拖动效果）

  
    

   
     
   
      1 
   
      
   
     <
   
     asp:ScriptManager 
   
     ID
   
     ="ScriptManager1"
   
      runat
   
     ="server"
   
     >
   
     

   
      2 
   
      
   
     </
   
     asp:ScriptManager
   
     >
   
     

   
      3 
   
      
   
     <
   
     asp:Panel 
   
     ID
   
     ="Panel1"
   
      runat
   
     ="server"
   
     >
   
     

   
      4 
   
      
   
     <
   
     asp:Panel 
   
     ID
   
     ="Panel2"
   
      runat
   
     ="server"
   
      BackColor
   
     ="#3399FF"
   
      ForeColor
   
     ="White"
   
     >
   
     

   
      5 
   
      我是标题，拖我吧
   
     </
   
     asp:Panel
   
     >
   
     

   
      6 
   
      
   
     <
   
     asp:Panel 
   
     ID
   
     ="Panel3"
   
      runat
   
     ="server"
   
     >
   
     

   
      7 
   
      我是内容，playaspx.com
   
     <
   
     br 
   
     />
   
     

   
      8 
   
      我是内容，playaspx.com
   
     <
   
     br 
   
     />
   
     

   
      9 
   
      我是内容，playaspx.com
   
     </
   
     asp:Panel
   
     >
   
     

   
     10 
   
      
   
     </
   
     asp:Panel
   
     >
   
     

   
     11 
   
      
   
     <
   
     cc1:DragPanelExtender 
   
     ID
   
     ="DragPanelExtender1"
   
      runat
   
     ="server"
   
      

   
     12 
   
      DragHandleID
   
     ="Panel2"
   
      TargetControlID
   
     ="Panel1"
   
     >
   
     

   
     13 
   
      
   
     </
   
     cc1:DragPanelExtender
   
     >
  
    

 常用属性

 1、TargetControlID,控制空间ID

 2、DragHandleID,拖动标题

 

固定拖动位置

 

  
    

   
     
   
     <
   
     script type
   
     =
   
     "
   
     text/javascript
   
     "
   
     >
   
     
 
   
     function
   
      setOrientation()
 {
 document.body.style.height
   
     =
   
     Math.max(document.documentElement.scrollHeight,document.body.scrollHeight)
   
     +
   
     "
   
     px
   
     "
   
     ;
 }
 setOrientation();
 $addHandler(window,
   
     "
   
     resize
   
     "
   
     ,setOrientation);
 
   
     <
   
     /
   
     script>