下图为一个简单的实现效果
最简实现html,css准备,一个nav bar,大家都会写的咯^.^1234<header id="header" style="background-color: rgba(247,247,247,0)" class="transparent_nav"> <img src="img/back.png"/> <h1>导航栏</h1> </header>
12345678.transparent_nav{ position: fixed; top: 0; left: 0; right: 0; height: 44px; display: block; }接下来就是js部分,将window.scrollY减去一个基线值,如0,再将差与一个固定的offset值比较,如150,得出此时的rgba中的a值12345var header = document.getElementById("header") window.addEventListener("scroll", funct...
阅读全文