Jquery。我已經達到了我想要的效果，但我只是希望它能夠在主頁上工作

我目前正在製作我的第二個網站，並且第一次使用了Jquery。當我加載主頁時，我想在頁面一側連續排列四個小方格，並按順序排列。Jquery。我已經達到了我想要的效果，但我只是希望它能夠在主頁上工作

我設法做到了！它看起來不錯，但我不希望每次觀看者點擊不同的頁面時都會產生效果。

如果有人能告訴我如何編碼這個動畫只是因爲它在我的索引頁上淡入淡出，我將非常感激。

我當前的代碼如下所列，

非常感謝！

$(document).ready(function(){ 

    $('.wrapper').fadeIn(1000); 

    $("#BlockOne").fadeIn('slow'); 

    $("#BlockTwo").fadeIn(2500); 

    $("#BlockThree").fadeIn(2500); 

    $("#BlockFour").fadeIn('slow'); 

});

來源

2012-11-29 user1864592

可以很容易地測試頁面，但你爲什麼把這個腳本的所有網頁上？ –

是否有一個特定的元素出現在主頁上，但沒有任何其他頁面？ –

有很多方法可以解決這個問題。

你可以簡單地不輸出這段JavaScript比上主頁的其他頁面。如果您需要使隱藏元素顯示在其他頁面上的功能，則可以執行一個替代javascript，在不使用fadeIn的情況下立即顯示它們。

您可以在所有頁面上輸出一個通用函數，但在文檔位置使用條件來確定是淡入還是立即顯示。

您可以將一些值保存在cookie或HTMLS localStorage或會話存儲中，以充當標誌以確定是否顯示淡入或立即顯示。

我個人更喜歡後者爲發生的事情是用戶不通過網頁訪問您的網站？我認爲你的意圖是在第一個訪問過的頁面上淡出效果，不一定是主頁。

來源

2012-11-29 21:56:05

將代碼放在主頁上的腳本塊中。大概所有其他頁面將需要單獨的CSS來確保您始終可以看到塊。

來源

2012-11-29 21:51:59

在按鈕的單擊事件處理程序中定義代碼並使用.one來綁定它。

然後觸發點擊事件..看起來像它的工作原理..

$(document).ready(function() { 
    // This will fire only once.. 
    $('button').one('click', function() { 
     $('.wrapper').fadeIn(1000); 
     $("#BlockOne").fadeIn('slow'); 
     $("#BlockTwo").fadeIn(2500); 
     $("#BlockThree").fadeIn(2500); 
     $("#BlockFour").fadeIn('slow'); 
    }); 

    $('button').click(); 
});

來源

2012-11-29 23:31:09

Jquery。我已經達到了我想要的效果，但我只是希望它能夠在主頁上工作

回答

相關問題