如何通过CSS或jQuery实现拖动?

时间:2016-01-02 06:48:14

标签: jquery css css3 jquery-ui

我正在尝试在我的项目中实现此Fiddle。我想在拖动项目时显示一些效果。此示例显示拖动时对文本的拖动效果。我想实现背景和文本。我需要做些什么才能生效。

这是我的CSS代码:

.ui-drop-hover {
    border: 2px solid #bbb;
}

#dragdiv li, #dropdiv li {
    border: 1px solid #bbb;
}

#dropdiv li {
    padding-left: 10px;
}

#maindiv {
    width: 500px;
    height: 350px;
    border: 2px solid #bbb;
}

#allItems, #Ul1 {
    list-style: none;
}

#dragdiv, #dropdiv {
    width: 180px;
    height: 250px;
    float: left;
}

#allItems li {
    background: #3195e0;
    color: #fff;
    text-align: center;
    padding: 5px;
}

正在设置列表的背景而不是拖动项目。

1 个答案:

答案 0 :(得分:1)

这行css代码为我完成了工作

.ui-draggable-dragging {
  background: #ccc;
  color: #000;
}

希望这能帮到你