jQuery楼层定位菜单代码是一款商城常用的点击侧边楼层或者鼠标滚轮滚动都能精确定位到页面对应的楼层位置的折叠式楼层菜单网页特效。
js代码
<script src=\"js/jquery.min.js\"></script> <script> $(function(){ $(\"li:odd\").hide();//li的第偶数个隐藏 $(\"#slider ul li.active\").next().show();//激活的li下面那条线显示 $(window).scroll(function(){ var winHeight = $(window).height();//浏览器可视窗口的高度 var scrollHeight = $(window).scrollTop();//鼠标滚动的距离 // if($(\"#header\").height()){ //判断侧边栏什么时候显示 $(\"#content .section\").each(function(){ if(winHeight+scrollHeight-$(this).offset().top>winHeight/2){ $(\"#slider ul li\").removeClass(\"active\").prev(\".line\").hide(); $(\"#slider ul li\").eq($(this).index()).addClass(\"active\").next(\".line\").show(); } }) // } }) $(\"#slider ul li\").click(function(){ var current = $(\"#content .div\").eq($(this).index()).offset().top; $(\"html,body\").animate({ \"scrollTop\":current },500); $(this).addClass(\"active\").siblings().removeClass(\"active\").siblings(\".line\").hide(); $(this).eq($(this).index()).addClass(\"active\").next(\".line\").show(); }) }) </script>
暂无评论内容