javascript - 带有 Bootstrap 布局的 jQuery UI Draggable

Question

jQuery 可拖动元素位于 Bootstrap 样式列 (col-*) 下。例如，我有两个 .row，每个都分为 4 列(使用 col-md-3)。我试图让第一行的列可以拖动到第二行的可放置列上。

但是当我拖动“Drag #”元素时，它们总是在“droppable”元素下面。我无法放弃使用 Bootstrap 样式。

有人可以解释为什么会发生这种情况并提供解决方案吗？

Bootply 示例:http://www.bootply.com/THBX5GJnCn

Answer 1

.ui-draggable-dragging 类似乎比其他类具有更低的“z-index”属性

像这里一样添加某物:

.ui-draggable-dragging {
z-index:10000!重要
}


这是有效的 jsfiddle:http://www.bootply.com/P0Okde8ZmV

上面的代码将解决这个问题。当然，我的 10000 值和 !important 在这里只是为了向您展示解决方案。每次都使用 !important 不太好，你无法获得 case 的线索:)