记一次被scroolTOP支配的经历

最新推荐文章于 2023-03-30 23:35:36 发布

bigmeow_lyj

最新推荐文章于 2023-03-30 23:35:36 发布

阅读量183

点赞数

CC 4.0 BY-SA版权

分类专栏：新人练手

本文链接：https://blog.youkuaiyun.com/bigmeow_lyj/article/details/90112574

新人练手专栏收录该内容

16 篇文章

订阅专栏

本文探讨了在网页中使用JavaScript实现滚动监听功能，并通过判断滚动位置来改变导航栏的显示状态，使其在滚动到一定位置后保持固定，提供了一种常见的网页布局优化技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先兼容性问题：

var scrollTOP=document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;

当然最让我无语的是下面

var scrollTOP=document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
window.onscroll=function(){
//	console.log(scrollTOP);
			if(scrollTOP>=260){
				seckillNav.className="seckill-nav seckill-navfixed";
			    }else{
			    seckillNav.className="seckill-nav";
			};
};

window.onscroll=function(){
	var scrollTOP=document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
//	console.log(scrollTOP);
			if(scrollTOP>=260){
				seckillNav.className="seckill-nav seckill-navfixed";
			    }else{
			    seckillNav.className="seckill-nav";
			};
};

观察两份代码，几乎没差，唯一的不同就是一个先获取scrollTOP,一个后获取scrollTOP；
导航栏可以实现固定
未完…