#

## SimpleUI示例中心

## Drag And Drop Demo

### 简单示例

$("#test").drag({ handle:"h2" });

## 拖动启动

### 复杂示例

- 全部3
- 收件箱
- 发件箱
- 草稿

||| | 今天做了些什么? | 2011/05/26
||| | 特大优惠? | 2011/10/26
||| | 今天做了些什么? | 2011/05/26

$(".mail-list tr span").drag({ proxy:function(){ return $("<div/>").addClass("drag-proxy") }, atCursor:{ top:-5, left:10 }, revert:true, dropElements:".demo-mail .drop", ondragstart:function(e,drag){ drag.dropElements.css("background","#f1f1f1"); }, ondrag:function(e,drag){ var length=$(".mail-list :checked").length; drag.proxyElement.text(length); }, ondragstop:function(e,drag){ drag.dropElements.css("background","transparent"); }, ondragenter:function(over,drag){ over.css("background","green"); }, ondragleave:function(over,drag){ over.css("background","#f1f1f1"); }, ondragdrop:function(over,drag){ over.find("em").text($(".mail-list :checked").length); $(".mail-list :checked").parents("tr") .addClass("drag_"+over.attr("rel")) //.hide(); $(".mail-list :checked").removeAttr("checked"); } }); $(".demo-mail li").click(function(){ var rel=$(this).attr("rel"); if(rel=="all"){ $(".mail-list tr").show(); }else{ $(".mail-list tr").hide(); $(".drag_"+rel).show(); } });