頁面負載上的順序圖像加載

Question

我已經瀏覽了這個網站，我已經在很大程度上找到了我正在尋找的東西。然而，在對CSS/HTML進行合理處理的同時，JavaScript對我來說是全新的，我恐怕在這裏變得模糊。

我試圖讓一些圖像順序加載在頁面加載，逐漸消失。我已經修改了以前的小提琴，它反映了幾乎相同的我想要的（除了鴨子！），你可以在這裏看到它：http://jsfiddle.net/v8azx/1/

我的問題是，我無法得到它在我的頁面上運行。我有一個.js文件題爲sequencer.js，並把這個頁面的頭部：（？只有這個，這可能是問題）

<script type="text/javascript" src="/sw3/sequencer.js"></script> 

我sequencer.js文件由該

$('.fbimg').each(function (i) { 
$(this).delay(500 * (i + 1)).fadeIn(1000); 
}); 

.fbimg是我試圖按順序加載的類。我的頁面上有兩個實例。

我的預感是，javascript根本不在我的頁面上運行，因爲它在小提琴上完美地工作。當我加載我的頁面時，圖像根本不會出現（因爲顯示：無，我假設），這似乎是一個必要的內容。

我錯過了什麼？

Answer 1

確保您已經先加載了jquery腳本;您可能錯過了將其包含在文檔中。

然後，我會把你的javascript包裝在jquery'document ready'函數中。

$(document).ready(function() { 
    $('.fbimg').each(function (i) { 
    $(this).delay(500 * (i + 1)).fadeIn(1000); 
    }); 
});