html中如何实现自定义菜单随着滚动条滑动效果

html中如何实现自定义菜单随着滚动条滑动效果？这个问题可能是我们日常学习或工作经常见到的。希望通过这个问题能让你收获颇深。下面是小编给大家带来的参考内容，让我们一起来看看吧！

1、给一个div

    <style>
            #menu{
                position: relative;top: 0px;
            }
    </style>
<div id="menu"> </div>

2、事件菜单，点击

<script>
		function showHide(num){
			if(num==1){
				$('html, body').animate({scrollTop: $('#biaoji1').offset().top},"slow")//"slow"
			}else if(num==2){
				$('html, body').animate({scrollTop: $('#biaoji2').offset().top},"slow")
			}else if(num==3){
				$('html, body').animate({scrollTop: $('#biaoji3').offset().top},"slow")
			}
		}
	</script>

3、滚动鼠标

<script>
			$(function(){
				window.onscroll=function(){
				var top2=$(document).scrollTop();
				//var top1=document.body.scrollTop;
				console.log("top2:"+top2)
				$("#menu").css("position","relative").css("top",top2);
				}
			});
</script>

感谢各位的阅读！看完上述内容，你们对html中如何实现自定义菜单随着滚动条滑动效果大概了解了吗？希望文章内容对大家有所帮助。如果想了解更多相关文章内容，欢迎关注亿速云行业资讯频道。