2

我正在开发一个交互式元素，该元素要求用户通过单击一个段落将段落排序为正确的顺序，然后单击第二个段落以在第二个段落之前或之后插入第一个段落（取决于他们是否在移动段落在列表中向上或向下）

http://jsfiddle.net/5ZQkz/2/

我的问题是，当一个段落被移动到不同的地方时，单击的第二个段落的悬停状态保持活动状态 - 即使该段落没有被悬停。这种情况一直发生，直到鼠标移动，此时正确的段落显示悬停状态。

例如，单击第 1 段，然后单击第 2 段。段落切换位置，但悬停状态在第 2 段仍处于活动状态，尽管鼠标悬停在第 1 段上。注意 - 此问题不会出现在 Firefox 中。

有任何想法吗？

function swapParas(node1, node2) {
if (node1.index() > node2.index()) node1.insertBefore(node2);
else node1.insertAfter(node2);
node1.hide().fadeIn();
node1.removeClass('selected');
}
4

1 回答 1

0 
.selected:hover {
  background:green;
}

试试上面的代码。

希望这是你想要的。

这是一个IE修复。看起来很奇怪，但这是你能得到的最好的：

function swapParas(node1, node2) {
  if (node1.index() > node2.index()) node1.insertBefore(node2);
  else node1.insertAfter(node2);
  node1.removeClass('selected');
  node2.after("<div class='para'>" + node2.html() + "</div>");
  node2.remove();
}
于 2013-01-07T14:39:49.420 回答