0

私はこれを達成する方法について頭を悩ませてきました。その中に2つの別々のaタグが含まれている包含​​要素がありますaddClass()（つまり、1つのaタグにカーソルを合わせると、そのタグにクラスが追加され、aその包含要素内の他のタグが追加されます）。私は以下のコードを使ってそれを手に入れました：

<li class="element">
<header>
   <h1>Heading</h1>
</header>
   <a href="">
      <img src="image" alt=" dummy" />
   </a>
   <div>
      <h2><a href="">Heading 2</a></h2>
      <p>Paragraph</p>
   </div>
</li>

$('.element').hover(
 function() {
  $(this).children().addClass('hover');
},
 function() {
  $(this).children().removeClass('hover');
}
);

ただし、要素全体ではなく、「a」自体でホバーをトリガーしたいだけです。残念ながら、この方法を使用すると：

$('.element a').hover(
 function() {
  $(this).addClass('hover');
},
 function() {
  $(this).removeClass('hover');
}
);

クラスを最初の「a」タグに追加するだけです。

アドバイスをいただければ幸いです。

4

2 に答える 2

0 
$('.element a').hover(
 function() {
  $(this).add($(this).siblings()).addClass('hover');
},
 function() {
  $(this).add($(this).siblings()).removeClass('hover');
}
);

$(this) には、ホバリングされている実際のオブジェクトのみが含まれます。オブジェクトの兄弟をそのセットに .add() 処理しました。必要に応じて、$(this).siblings('a') などでフィルター処理できます。

于 2011-11-08T10:19:56.507 に答える
0

各要素にaddClassを適用する必要があります...これを試してください：

$('.element a').each(function() {
    $(this).hover(function() {
        $(".element a").each(function() {
            $(this).addClass('hover');
        });
    }, function() {
        $(".element a").each(function() {
            $(this).removeClass('hover');
        });

    });
});

http://jsfiddle.net/manseuk/GqP4Z/

于 2011-11-08T10:27:49.910 に答える