0

というクラスがあります.bxSlider

.bxSliderこの jQuery をすべてのDiv ボックスに適用したいと考えています。ただし、個々のボックスに jQuery を適用したいと考えています。

$(document).ready(function(){
    // LOAD ITEM SLIDER
    $('.bxslider').bxSlider({
        pager:false     
    });
    // BLACK IMAGE HOVERS
    $(".bxslider").hover(function() {
        $(this)(".bx-wrapper .bx-prev").css("background-image", "url(//www.cdn.com/running/left_arrow_off.png)");
        $(this)(".bx-wrapper .bx-next").css("background-image", "url(//www.cdn.com/running/right_arrow_off.png)");
    }, function() {
        $(this)(".bx-wrapper .bx-prev").css("background-image", "url(//www.cdn.com/running/left_arrow_on.png)");
        $(this)(".bx-wrapper .bx-next").css("background-image", "url(//www.cdn.com/running/right_arrow_on.png)");
    });
});

HTML コードなので、複数のボックスをどのように使用しているかがわかります。

<div class="items">
    <div class="bxslider bx-wrapper">
        Hello <a class="bx-prev" href=""></a>
        Goodbye <a class="bx-next" href=""></a>
    </div>
    <div class="bxslider bx-wrapper">
        Hello <a class="bx-prev" href=""></a>
        Goodbye <a class="bx-next" href=""></a>
    </div>
</div>

使用してthisいますが、動作させることができません

4

1 に答える 1

1

.bx-prev が .bxSlider の子であると仮定すると、次のようになります。

<div class="bxSlider bx-wrapper">
  <div class="bx-prev"></div>
</div>

.

 $(this).find(".bx-prev").css("background-image", "url(//www.cdn.com/running/left_arrow_off.png)");

.bx-slider の親をターゲットにしたい場合は、次のようにします。

$(this).closest("#desiredParentId").css("background-image", "url(//www.cdn.com/running/left_arrow_off.png)")
于 2013-02-14T14:44:38.190 に答える