如何在設定的秒數後出現網站導航菜單？

Question

我正在創建一個包含全屏預告片的網站作爲首頁。該視頻包含客戶標誌的動畫版本，我希望在動畫標誌消失並且視頻開始後，頁面的導航欄淡入。

是否有最佳做法使頭版導航欄在一段時間後淡入？

Answer 1

我不知道的「最佳做法」，但它應該是很簡單...

window.onload = function(){ 
    var navigationElement = document.getElementById("foo"); 
    setTimeout(function(){ 
    navigationElement.style.opacity = 1; 
    },5000); 
} 

這將在頁面加載完成後5秒內的元素褪色。
要確保元素具有淡入淡出效果，您可以使用CSS過渡...

#foo{ 
    opacity: 0; 
    transition: opacity 0.5s; 
} 

Answer 2

css3 fade in on page load, out after seconds

您可以使用CSS關鍵幀，或轉換（延遲參數）。