1

$(this) セレクター内の要素を選択しようとしています

クラス.category_row_beltsのいくつかのdivがあります。それぞれのタグ内には、H2 タグと画像を囲むアンカー タグがあります。

div をロールオーバーするとき、jQuery の .hover() と addClass() を使用して、H2 と img の両方に同時にロールオーバー効果を作成しようとしています。つまり、div をロールオーバーすると、すべての要素が点灯します。明らかに、$(this) を使用して children() を使用する必要がありますが、機能していません。

<div class="category_row_belts">
<a href="linkhere.html">
<h2 class="belts-cat-description" >Product name here</h2>
<img src="img/product-pic.jpg">
</a>
</div>

これまでの私のjsは...

$('.category_row_belts').hover(
function(){
    $(this).children('a > img').addClass('rolloverborder');
    $(this).children('a > h2').removeClass('belts-cat-description');
    $(this).children('a > h2').addClass('rollovertxt');
},
function(){
    $(this).children('a > img').removeClass('rolloverborder');
    $(this).children('a > h2').removeClass('rollovertxt');
    $(this).children('a > h2').addClass('belts-cat-description');
})
4

1 に答える 1

2
$('.category_row_belts').hover(
function(){
    $(this).find('img').addClass('rolloverborder');
    $(this).find('h2').removeClass('belts-cat-description')
    .addClass('rollovertxt');
},
function(){
    $(this).find('img').removeClass('rolloverborder');
    $(this).find('h2').removeClass('rollovertxt')
   .addClass('belts-cat-description');
})
于 2013-11-01T23:06:08.203 に答える