【发布时间】:2023-04-08 12:17:02
【问题描述】:
【问题讨论】:
标签: javascript html ember.js ember-drag-sort
【问题讨论】:
标签: javascript html ember.js ember-drag-sort
ember-drag-sort
使用简单的 CSS 技术来呈现占位符::before
和 :after
伪元素。
不幸的是,这不适用于 HTML 表格,因为表格语义非常严格。要解决此问题,可以使用表格单元格上的顶部/底部填充来代替选择器。
这不是一个很好的解决方案,因为填充出现在表格单元格内。如果您希望单元格有边框,则必须将它们应用于内部元素。
表格现在是demo 的一部分,请查看。
以下是演示中使用的 CSS 覆盖:
table {
width: 100%;
}
table.dragSortList.-isExpanded {
padding: 15px;
background-color: #f6f6f6;
}
table.dragSortList.-isExpanded.-isDraggingOver {
background-color: #eee;
}
table.dragSortList.-isExpanded.-isDraggingOver:before {
content: none;
}
tr.dragSortItem.-placeholderAbove:before,
tr.dragSortItem.-placeholderBelow:before {
content: none;
}
tr.dragSortItem.-placeholderAbove td {
padding-top: 25px;
}
tr.dragSortItem.-placeholderBelow td {
padding-bottom: 25px;
}
table .the-item {
margin: 0;
}
如果这种方法不适合您,很遗憾,此插件目前无法提供任何其他功能。您必须恢复到 div
s 或使用另一个拖动排序插件。
【讨论】: