html中自定义菜单随着滚动条滑动的代码实现

2020-07-19 00:16:53
本篇文章给大家带来的内容是关于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>

相关推荐:

浏览器中重绘以及回流的概念解析