對象的響應區域
`hit-margin: 4px 5px 4px 8px;`
將元素的交互范圍擴大. (從元素的 border 算起)
格式同 margin 屬性.
右鍵菜單
`context-menu: selector(#ITEM_CONTEXT_MENU);`
為元素指定對應的右鍵菜單.
鼠標拖放操作
~~~
.item {
draggable: only-move;/* 定義拖放的形式 */
}
.item-container {
drop: insert;/* 定義拖放結束時的處理方式 */
accept-drop: selector( .item );/* 定義容器可接受的被拖放對象 */
}
~~~
draggable 有 4 個取值, 它決定了元素被拖放時的行為:
o none 不可拖動
o copy-move 復制并移動
o only-copy 僅復制
o only-move 僅移動
drop 也有 4個取值, 它決定了放開鼠標后拖放的結果:
o insert 在鼠標位置插入
o append 在最后面添加
o prepend 在最前面添加
o recycle 刪除
accept-drop 用通過css選擇符決定了容器可以接受的被拖放對象范圍.
在HTMLayout 的 Demo 里面的 html_samples\drag-n-drop\ 目錄下有相關示例.
網站上有對此的詳細介紹: http://www.terrainformatica.com/wiki/h-smile/drag-n-drop
