twitter-bootstrap 带有 Bootstrap 布局的 jQuery UI 可拖动
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27642553/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery UI Draggable with Bootstrap layout
提问by CoderTR
jQuery draggable elements goes under the bootstrap styled columns (col-*). For example, I have two .roweach divided into 4 columns (with col-md-3). I am trying to get the first row columns to be draggable onto 2nd row droppable columns.
jQuery 可拖动元素位于引导样式列 (col-*) 下。例如，我有两个，.row每个分为 4 列（带有col-md-3）。我试图将第一行列拖到第二行可放置列上。
But when I drag 'Drag #' elements, they always go under the 'droppable' elements. I am not able to get drop working with Bootstrap styles.
但是当我拖动 'Drag #' 元素时，它们总是在 'droppable' 元素下。我无法直接使用 Bootstrap 样式。
Can someone explain why this is happening and provide a solution?
有人可以解释为什么会发生这种情况并提供解决方案吗？
Bootply Exmple: http://www.bootply.com/THBX5GJnCn
Bootply 示例：http: //www.bootply.com/THBX5GJnCn
采纳答案by Micha? Kutra
Is seems that class .ui-draggable-dragginghas lower `z-index' property than others
似乎该类.ui-draggable-dragging具有比其他类更低的“z-index”属性
Adding sth like here:
添加某事像这里：
.ui-draggable-dragging {
z-index: 10000!important
}
.ui-draggable-dragging {
z-index: 10000!important
}
Here is jsfiddle which works: http://www.bootply.com/P0Okde8ZmV
这是有效的 jsfiddle：http: //www.bootply.com/P0Okde8ZmV
Code above will fix the problem. Of course my 10000 value & !important are here just to show You solution. It's not so pretty to use !important each time, You can't get the clue of case :)
上面的代码将解决问题。当然，我的 10000 值和 !important 只是为了向您展示解决方案。每次都使用 !important 不是很漂亮，您无法获得案例的线索:)
