如何將標題的背景顏色從透明更改爲白色？

Question

在以下代碼中，標題顏色是透明的。當我向下滾動頁面時，我想將其顏色更改爲「#FFF」。請指導我如何爲它編寫相關的js代碼。

此外，它可以通過普通的CSS來完成？

div { 
 
    height: 1000px; 
 
    width: 100%; 
 
} 
 
#home { 
 
    background-color: red; 
 
} 
 
header { 
 
    background-color: transparent; 
 
    color: ffffff; 
 
    height: 100px; 
 
    position: fixed; 
 
    width: 100%; 
 
    top: 0; 
 
    z-index: 100; 
 
}

<header>Top Navigation</header> 
 
<div id="home" class="sect"></div>

Answer 1

Pen試試這個。它應該幫助你。你應該要麼jQuery的或純JavaScript的那樣做

$(document).ready(function() { 

$(window).scroll(function() { 
//if you hard code, then use console 
//.log to determine when you want the 
//nav bar to stick. 
console.log($(window).scrollTop()) 
if ($(window).scrollTop() > 10) { 
$('header').css('background-color','#FFF'); 
} 
if ($(window).scrollTop() < 10) { 
$('header').css('background-color','transparent'); 
} 
}); 
}); 

Answer 2

你嘗試用background-color:rgba(0,0,0,0);？