jquery保持菜单始终处于网页顶部

最新推荐文章于 2019-04-19 00:46:41 发布

转载最新推荐文章于 2019-04-19 00:46:41 发布 · 444 阅读

jquery 专栏收录该内容

9 篇文章

订阅专栏

本文介绍了一种使用jQuery实现元素固定在页面顶部的技术，特别适用于导航菜单、工具栏等，确保重要信息在滚动时始终保持可见。

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

以下代码片段允许某一元素始终处于页面顶部。可以想见，其非常适合处理导航菜单、工具栏或者其它重要信息。

$(function(){  
	var $win = $(window);  
	var $nav = $('.mytoolbar');  
	var navTop = $('.mytoolbar').length && $('.mytoolbar').offset().top;  
	var isFixed=0;  
	processScroll();
	$win.on('scroll', processScroll);
	 
	function processScroll() {  
		var i, scrollTop = $win.scrollTop(); 
		if (scrollTop >= navTop && !isFixed) { 
			isFixed = 1; 
			$nav.addClass('subnav-fixed'); 
		} else if (scrollTop <= navTop && isFixed) {  
			isFixed = 0; 
		$nav.removeClass('subnav-fixed');
		}
	}
});

原文地址：https://www.codelovers.cn/article/20180324140422.html