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

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

成都创新互联公司执着的坚持网站建设，小程序开发；我们不会转行，已经持续稳定运营10年。专业的技术，丰富的成功经验和创作思维，提供一站式互联网解决方案，以客户的口碑塑造品牌，携手广大客户，共同发展进步。

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中如何实现自定义菜单随着滚动条滑动效果大概了解了吗？希望文章内容对大家有所帮助。如果想了解更多相关文章内容，欢迎关注创新互联行业资讯频道。

网页标题：html中如何实现自定义菜单随着滚动条滑动效果
URL链接：https://www.cdcxhl.com/article0/ghseio.html

成都网站建设公司_创新互联，为您提供网站导航、网站排名、外贸网站建设、全网营销推广、移动网站建设、面包屑导航

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联