0

以下のタグ構造があります。これは、ページ全体で 9 回繰り返されます。9 つの 'itemInfo' div の 1 つにカーソルを合わせると、すべてのテキストの色が白に変わります (リンクを含む)。jQueryを使用してこれらすべてを選択するにはどうすればよいですか? 以下の私の試みを参照してください。

<div class="row itemInfo">
    <div class="row">
        <div class="twelve columns itemImage">
            <img src="http://lorempixel.com/250/185/abstract/">
            </div>
        </div>
    </div>

    <div class="row">
        <div class="twelve columns itemDetails"> 
            <h3><a href="#">title</a></h3>
            <p class="quiet">submitted by <a href="#">designer</a></p>                   
        </div>
    </div>
</div>

私の試み:

$(".itemInfo").hover(function() {
    $(this).find('h3 a').addClass('itemInfoActive');
    $(this).find('p').addClass('itemInfoActive');
    $(this).find('p a').addClass('itemInfoActive');
    return false;
4

3 に答える 3

0
$(".itemInfo").mouseenter(function() {
    $('a,p,h3',this).addClass('itemInfoActive');
});
于 2012-10-29T09:25:19.710 に答える
0

これにはユニバーサルセレクターを使用できます。

$(".itemInfo").hover(function() {    
    $(this).find('*').addClass('itemInfoActive');
});
于 2012-10-29T09:26:57.103 に答える
0

これを確認してくださいWorking demo http://jsfiddle.net/E8uws/ または使用mouseoutor mouseover=> http://jsfiddle.net/yUf4Q/

さらに読みたい場合は、http: //api.jquery.com/category/selectors/を参照してください。

残りはあなたの必要性を助けるはずです:) コード

$(function() {
    $(".itemInfo").hover(function() {
            $(this).parent().find('*').css('color', 'red');
    });
});​

追加コード

$(function() {
    $(".itemInfo").mouseover(function() {
        $(this).parent().find('*').css('color', 'red');
    }).mouseout(function() {
        $(this).parent().find('*').css('color', 'black');

    });
});​
于 2012-10-29T09:29:45.617 に答える