純js操作div移動

　　

　　可移動   
　　可調整大小   
　　

　　
　　

　　默認居中打開   
　　保留位置上打開
　　

　　

打開DIV

　　

操作說明：

　　

1. 
   　　
2. 
   　　選中複選框（可移動、可調整大小）後，打開的DIV具有移動/調整大小的功能(此時移動/調整大小快捷鍵可使用);
   
   　　反之，不可移動/調整大小(此時移動/調整大小快捷鍵無效)
   　　
   　　
3. 
   　　單選框默認居中打開選中，無論有無保存DIV位置和大小均以默認位置及大小打開DIV
   　　
   　　
4. 
   　　單選框保留位置上打開選中，如果未發現保存記錄以默認方式打開，否則以保存的位置及大小打開
   　　
   　　
5. 
   　　如果選中可移動後，鼠標經過標題位置（藍色背景）處會變成移動的圖標，此時按住鼠標左鍵會產生一個半透明的DIV，按住鼠標不動拉動此半透明DIV會跟隨移動，釋放鼠標左鍵後會產生一段原始位置移動至半透明位置的動畫，當動畫重疊時，半透明的DIV將回收。
   　　
   　　
6. 
   　　如果選中可調整大小後，鼠標經過整個DIV的最右下角處會變成伸縮的圖標，此時按住鼠標左鍵會產生一個半透明的DIV，按住鼠標不動拉動此半透明DIV會隨着移動而調整大小，釋放鼠標左鍵後會產生一段原始大小伸縮至半透明大小的動畫，當動畫重疊時，半透明的DIV將回收。
   　　
   　　
7. 
   　　DIV的右上角有關閉按鈕，按下後DIV將remove
   　　
   　　

　　

　　快捷鍵說明：
　　

1. 
   　　
2. 
   　　Ctrl + Enter : 打開div
   　　
   　　
3. 
   　　Ctrl + s(大小寫均可) : 保存div的大小和位置
   　　
   　　
4. 
   　　上下左右箭頭 : 輕移div位置
   　　
   　　
5. 
   　　Ctrl + 上下左右箭頭 : 輕調div大小
   　　
   　　
6. 
   　　Esc : 關閉Div