分享一段悬浮菜单固定在网页顶部的JS代码:
<script> // 定义菜单栏离页面顶部的距离,默认为200 var divOffsetTop = 200; //滚动事件 window.onscroll=function(){ var div = document.getElementById("topmenu"); // 计算页面滚动了多少(需要区分不同浏览器) var topVal = 0; if(window.pageYOffset){//这一条滤去了大部分, 只留了IE678 topVal = window.pageYOffset; } else if(document.documentElement.scrollTop ){//IE678 的非quirk模式 topVal = document.documentElement.scrollTop; } else if(document.body.scrolltop){//IE678 的quirk模式 topVal = document.body.scrolltop; } if(topVal <= divOffsetTop){ div.style.position = ""; } else { div.style.position = "fixed"; } }; // 页面加载完之后,计算菜单栏到页面顶部的实际距离 window.onload=function(){ var div = document.getElementById("topmenu"); divOffsetTop = div.offsetTop; }; </script>" />