2

ユーザーが 1 つの段落をクリックし、次に 2 番目の段落をクリックして最初の段落を 2 番目の段落の前または後に挿入することにより、段落を正しい順序に並べ替える必要があるインタラクティブな要素に取り組んでいます (段落を移動しているかどうかによって異なります)。リストを上または下に）

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

私の問題は、段落が別の場所に移動された場合、クリックされた 2 番目の段落のホバー状態がアクティブなままになることです。その段落がホバーされていなくてもです。これは、マウスが移動するまで発生し、その時点で正しい段落がホバー状態を示しています。

たとえば、段落 1 をクリックしてから段落 2 をクリックします。段落の位置が切り替わりますが、段落 1 の上にマウスを置いても、段落 2 のホバー状態はアクティブのままです。注 - この問題は、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 に答える