0

私はjQueryに少し慣れておらず、関数を実現するのに苦労しているので、誰かが私を少し案内してくれることを本当に望んでいます。私が基本的にやりたいのは、2つの要素を同時に強調表示することです（toggleClassを介して）。

基本的に#post、タイトル、サム、説明のdivを含む繰り返しdiv（）があります。私がやりたいのは、タイトルにカーソルを合わせるか、要素を親指でdivして、新しい追加のクラス（xxxHover）を取得することです。したがって、基本的に、ユーザーがtitle / thumb divにマウスを合わせると、title / thumb div（両方）は（xxxHoverxxxはdiv名を表します-この場合はtitleHover / thumbHover）という新しいクラスを取得します。

私は説明するのが得意ではないかもしれないので、jsFiddleも用意しました：

http://jsfiddle.net/yLqnd/12/

ご覧のとおり、私の問題は、現在の要素（この場合は#post）のスクリプトのみを制限することです。これがWordPressWebサイトに統合されると言わなければならない場合（つまり、HTML構造は基本的にloop.phpにあります）、そのため、アイテムごとに2倍のハイライト効果のみを制限したいと思います（#post） 。

アイデアを事前に工場に感謝します！

4

4 に答える 4

0

http://jsfiddle.net/oscarj24/yLqnd/13/

于 2012-07-24T15:44:39.370 に答える
0

jQueryで.siblings（）を使用すると、探している効果を得ることができると思います。

$(".title").mouseover(function(){    
    $(this).toggleClass("titleHover");
    $(this).siblings(".thumb").toggleClass("thumbHover");
});

これにより、toggleClassは同じ.postにある.thumbのみに制限されます。

http://api.jquery.com/siblings/

于 2012-07-24T15:47:01.570 に答える
0

更新された jsFiddle は次のとおりです。それほど具体的ではなく、内部の div がクラスをトグルするようになりました。

jsFiddle リンク

基本的に、私はそれをすべてまとめました：

$(".post div").mouseover(function(){  
    $(this).closest('.post').find('div').toggleClass('thumbHover');
}).mouseout(function(){    
    $(this).closest('.post').find('div').toggleClass('thumbHover');
});
于 2012-07-24T15:45:40.187 に答える
0

シンプルに、両方の要素の親でそれを行うだけです:

$(".post").mouseover(function(){  
    $(this).find('div').toggleClass('thumbHover');
}).mouseout(function(){    
    $(this).find('div').toggleClass('thumbHover');
});
于 2012-07-24T15:52:11.950 に答える