0

divの最初と2番目の画像をすべてターゲットにしようとしています。

<div class="poscik">        
    <div class="post-image-film">
        <img src="<?php bloginfo( 'template_url' ); ?>/images/film_hover.png" />        

       <img src="
                <?php
                if ($image_url_sm) {
                    echo $image_url_sm[0];
                } 
                else {
                    echo bloginfo( 'template_url' ) . "/images/generic_thumbnail.png";
                }?>
        " />    
</div>

まずはその他のホバー効果です。

$('.post-image-film img').eq(0).css({
    'position': 'absolute',
    'z-index': '2'
}).hide();

$('.post-image-film img').eq(1).css({
    'position': 'absolute',
    'margin-top': '-270px;'
});

$('.poscik').hover(function () {
    $("img", this).eq(0).fadeToggle();
});

これは私がこれまでに得たものです。"poscik"クラスが繰り返されるという事実のために。これは最初の div にのみ適用されclass="poscik"ます。他の画像をラックに入れるには、切り替える必要がありeq(3)ますeq(4)。これは私には不可能です。助けていただければ幸いです。

4

2 に答える 2

1

最初の 2 つの要素を選択するには、2 つの比較的単純なオプションがあります。

$('.post-image-film img:lt(2)')

JS フィドルのデモ。

と：

$('.post-image-film img::nth-child(-n + 2)')

JS フィドルのデモ。

参考文献:

于 2013-06-14T11:40:41.947 に答える
0

私はそれがうまくいくと確信しています：

$('.post-image-film img').children(':eq(0)').css({'position' : 'absolute', 'z-index' : '2'}).hide();
$('.post-image-film img').children(':eq(1)').css({'position' : 'absolute', 'margin-top' : '-270px;'});

$('.poscik').hover(function() {
    $("img", this).children(':eq(0)').fadeToggle();

});
于 2013-06-14T11:37:01.160 に答える