Question

我有这样简单的幻灯片代码：

function anim() {
    $(".images img").first().appendTo('.images').fadeOut(500);
    $(".images img").first().fadeIn(500);    
    setTimeout(anim, 5000);
}

这是我的HTML代码

<div class="subbox-1">
        <div class="caption">
               <div class="caption-text">
                   <h3>COAL MINING</h3>
                      <p>
                           Lorem Ipsum dolor sit amet.
                      </p>
               </div>
         </div>
         <div class="images">
                <img src="images/thumb1.jpg" />
                <img src="images/thumb1-1.jpg" />
                <img src="images/thumb1-2.jpg" />
                <img src="images/thumb1-3.jpg" />
         </div>
</div>

我有很多.subbox-1具有不同的图像源。但是我的Jquery代码只适用于一个.subbox-1图像，如果我有两个.subbox-1第二个.subbox-1的图像不会改变。

请帮助我，谢谢之前：）

Answer 1

您可以使用jQuery selector context，以便只对上下文的后代执行搜索。有关此主题的更多讨论，请参阅this SO question。

基本上你的anim函数需要1个参数：

function anim(selector) {
    ...
}

您可以将上下文（通常为this）传递给anim函数：

$(".subbox-1").each(function() {anim(this)});

编辑：

Jquery图片幻灯片只影响一个DIV

1 个答案: