简单的html及css样式
<div id="box1"></div>
<div id="box2"></div>
*{
padding: 0;
margin: 0;
}
body{
height: 2000px;
}
#box1{
width: 100%;
height: 30px;
background-color: aqua;
position: relative;
}
#box2{
width: 100%;
height: 80px;
background-color: beige;
position: absolute;
}
js实现效果
window.onscroll=function(){
var ntop=parseInt(document.documentElement.scrollTop)
if (ntop>30) {
document.getElementById('box2').style.top=ntop+'px'
} else{
document.getElementById('box2').style.top='30px'
}
}