1

したがって、基本的に、サブメニューの要素にカーソルを合わせている間、下矢印のトップレベルのカテゴリ画像をオンにしようとしています。ホバー機能でjQueryを介してこれを行いたいのですが、私の人生では、サブメニュー項目をターゲットにするセレクターを取得できません。

実行しようとしているコードは次のとおりです。

$(document).ready(function() {
    $('.sub ul > li').hover(function() {
        $(this).parents('a.sub').attr('src', 'images/DownArrow.png');
},
function(){
     $(this).parents('a.sub').attr('src', 'images/DownArrowOff.png');
   }); 
});

このドロップダウン メニューで:

http://www.seth-duncan.com/Test/TestMenu.html

しかし、私が言ったように、それらのサブメニュー項目を対象とするセレクターを理解できないので、画像の src を変更できます。

これは、CSS ではなく jQuery を介して行う必要があります (動作することはわかっていますが、このタスクを達成する方法とは異なります)。

助けてくれてありがとう。

-セス

4

2 に答える 2

2

問題は、ホバーするliに到達するために使用しているセレクターにあります。$('.sub ul > li') のセレクターは、サブのクラスを持つ要素内の ul 要素を探しています。あなたの ul 要素は、実際にはクラス sub の兄弟です。セレクターを $('.sub ~ ul > li') のように変更すると、すべての li が正しくターゲットになります。

ここで、artlung が投稿したものを使用して、矢印イメージを元に戻すためのセレクターは次のようになります。

$(this).parents('li:has(a)').children('a.sub').find('img')

画像が表示されたら、好きなように属性を変更できます。

于 2009-06-25T17:34:39.517 に答える