仿osc推薦浮動條（demo）

時間 2019-11-19

標籤 osc 推薦浮動 demo 简体版

原文原文鏈接

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<style type="text/css">
#a1 {
	height: 150px;
	width: 1000px;
	background: #aaa;
}
#a2 {
	height: 50px;
	width: 1000px;
	background:#ab9;
	z-index:999;
	top:0px;
}
#a3 {
	height: 1720px;
	width: 1000px;
	background:#fb9;
}
</style>
<script type="text/javascript">

function flo(){
var p=document.body.scrollTop;
var i=document.getElementById("a2");
document.getElementById("a3").innerHTML=p;
if(p>=document.getElementById("a22").offsetTop){
	i.style.position="fixed";
	
}else{
	i.style.position="static";
}

}
setInterval(flo,1);
</script>
</head>
<body>
<div id="a1">這是第一個div</div>
<div id="a22"></div>
<div id="a2">這是須要浮動的div</div>
<div id="a3" onMouseOver="flo();">這是用來佔位的div </div>
</body>
</html>

原本能夠用absolute定位的，可是由於函數刷新頻率問題，推薦條老是會抖動。javascript

還有一個問題就是js怎麼控制fixed的top屬性呢？依舊沒有用jquery。。。。css

相關標籤/搜索

osc