首页 > 代码库 > js实现导航菜单栏随着屏幕的滚动进行滚动的效果

js实现导航菜单栏随着屏幕的滚动进行滚动的效果

 1   $(window).scroll(function () { 2             var $nav = $(".floatingMenu ul li"), 3                 length = $nav.length-1,//获取导航菜单 ul li 的个数 4                 item = new Array(),//新建一个数组 5                 sTop = $(window).scrollTop();//获取偏移的高度 6             for (var i = 0; i < length; i++) { 7                 if (i == 0) { 8                     item[i + 1] = $(".blockList>div:first-child").offset().top; 9                     if (sTop >= item[i + 1]) {10                         $nav.eq(i).addClass("selected").siblings("li").removeClass("selected");//选中的样式selected11                     }12                 } else {13                     item[i + 1] = $(".blockList>div:nth-child(" + (i + 1) + ")").offset().top;14                     if (sTop >= item[i + 1] - 100) {15                         $nav.eq(i).addClass("selected").siblings("li").removeClass("selected");16                     }17                 }18             }19         })

 

js实现导航菜单栏随着屏幕的滚动进行滚动的效果