jQuery可拖动改变CSS“顶部”值

我有一个两列的表;名称和项目（由图像表示）。jQuery可拖动改变CSS“顶部”值

<table> 
    <tr> 
    <td class='name'>bob</td> <td class='items'><img src='thing1.gif' class='item'></td> 
    </tr> 
    <tr> 
    <td class='name'>joe</td> <td class='items'><img src='thing2.gif' class='item'></td> 
    </tr> 
</table>

我想有用户能够从一个行（从乔即，移动“thing2.gif”鲍勃）拖动图像到另一个。我做到了这一点与jQuery如下：

// initialize these as draggable 
$(".item").draggable({ 
    revert: "invalid", 
    ghosting: true, 
    opacity: 0.5, 
}); 

$(".items").droppable({ 
    accept: ".item", 
    activeClass: "drop_active", 
    drop: function(event, ui) { 
     $(this).append(ui.draggable); 
    } 
});

我现在遇到的问题是，在移动后，每个IMG似乎有获得了一个新的CSS属性：top: ±X;，其中X代表形象是如何的感动垂直。也就是说，如果我在拖放图像之前将图像拖动到像素上，它将具有top: -40px的属性。这会使其在新行上方显示40个像素的效果。有谁知道如何解决这个问题？或者，任何人都可以提出一个更好的方法来做到这一点

来源

2009-12-23 eykanal

只需删除放置处理程序中的顶级属性即可。

$(this).append($(ui.draggable).css('top',''));

来源

2009-12-23 14:35:12 tvanfosson

对于未来的形式谷歌..你也可以添加：

.ui-draggable-dragging{ 
    top:0 !important; 
}

来源

2017-07-05 15:03:42 sanjihan

jQuery可拖动改变CSS“顶部”值

回答

相关问题