jQuery隨機衰落圖像（從兄弟姐妹）在隨機div（具體類）

Question

我想要一個腳本使用jQuery在一個div內淡入和淡出圖像。

我用下面的代碼（從http://jonraasch.com/blog/a-simple-jquery-slideshow）：

function slideSwitch() { 

var $active = $('div.box1 img.active'); 

if ($active.length == 0) $active = $('div.box1 img:last'); 

    var $sibs = $active.siblings('img'); 
    var rndNum = Math.floor(Math.random() * $sibs.length); 
    var $next = $($sibs[ rndNum ]); 


$active.addClass('last-active'); 

$next.css({opacity: 0.0}) 
    .addClass('active') 
    .animate({opacity: 1.0}, 1000, function() { 
     $active.removeClass('active last-active'); 
    }); 
} 

$(function() { 
setInterval("slideSwitch()", 5000); 
}); 

這個腳本目前運作良好，並從來自div.box1內的兄弟姐妹圖像隨機選擇。

除此之外，我決定我也希望它首先從頁面中選擇一個具有類「boxgrid」（而不是像.box1這樣的特定類）的隨機div（有6個容器div。 boxgrid類應用），它們是圖像的容器。

即我首先要隨機選擇一個.boxgrid div，然後在該選定div內繼續，並根據上述腳本選擇一個隨機圖像並淡入到下一個。下面是我使用的XHTML：

<div class="boxgrid box1"> 
          <img src="img/homepage/box1-1.png" class="active"/> 
          <img src="img/homepage/box1-2.png"/> 
          <div class="boxcaption"> 
           <h3>Header</h3> 
           <p>Text goes here...</p> 
          </div> 

         </div> 

嘗試此我自己（我不是很明顯程序員 - 但我想）我已經拿出了以下內容：

function slideSwitch() { 

var $randbox = $('div.boxgrid').siblings(); 
var rndBox = Math.floor(Math.random() * $randbox.length); 


var $active = $($randbox[ rndBox ]); 

if ($active.length == 0) $active = $('img:last'); 

    var $sibs = $active.siblings('img'); 
    var rndNum = Math.floor(Math.random() * $sibs.length); 
    var $next = $($sibs[ rndNum ]); 


$active.addClass('last-active'); 

$next.css({opacity: 0.0}) 
    .addClass('active') 
    .animate({opacity: 1.0}, 1000, function() { 
     $active.removeClass('active last-active'); 
    }); 
} 

$(function() { 
setInterval("slideSwitch()", 5000); 
}); 

我我在尋找一些幫助，因爲我努力讓它選擇一個隨機的div.boxgrid，然後隨着它在原始腳本中隨機淡入圖像。我關門了嗎？

任何幫助將不勝感激。

謝謝。

Answer 1

首先你應該使用setTimeout而不是setInterval在我看來。

其次，jQuery的有一個上拉和下滑的方法，你可以使用將做同樣的事情。

第三，您可以使用eq方法來選擇索引框。

例如$（ '框：EQ（' + RANDOM_NUMBER + '）'）了slideDown（）;

並使用setTimeout來做slideUp