私のスクリプトを複数のULで機能させる方法を知っている人はいますか?
私の jsfiddleを見てください。
ご覧のとおり、スクリプトはマウスオーバーの 2 番目の ul に対してのみ機能します。
よろしくお願いします!
敬具、
ジョナサン
私のスクリプトを複数のULで機能させる方法を知っている人はいますか?
私の jsfiddleを見てください。
ご覧のとおり、スクリプトはマウスオーバーの 2 番目の ul に対してのみ機能します。
よろしくお願いします!
敬具、
ジョナサン
では、何が起こっていたのか説明しましょう。最後に作成された div のみを選択していたため、その div のみが使用されていました。
.active
選択されたものと選択されたものを見つけなければなりませんでしたdiv
次に例を示します。
http://jsfiddle.net/JoshuaPack/YFUsJ/23/
これmouseover
を一番上に追加して変更active
し、animation
vars
active = $(this).parent().find('.active');
animation = $(this).parent().find('div');
でこれmouseout
を追加しました。
active = $(this).find('.active');
animation = $(this).find('div');
編集:active
クラスを他の<li>
オブジェクトに
移動する際の問題については<div>
、各.active
クラスを個別に追加する必要があります。例を次に示します。
http://jsfiddle.net/JoshuaPack/YFUsJ/31/
私がしたことは、アニメーション変数を.each
$.each(active, function() {
var animation = $('<div>').css({
'position': 'absolute',
'height': $(this).outerHeight()-1,
'width': $(this).outerWidth(),
'marginTop': ($(this).parent().index() * $(this).outerHeight()),
'borderBottom': '1px solid #000',
'z-index': -10
});
$(this).parent().parent().prepend(animation);
});
代わりに、または以前の<ul>
ように前に付けて、クラスのメニューに常に存在する必要がある親の親にそれを行いましたactive
。