左边为选项卡，右边为内容，当鼠标滚轮滚动到某一位置时，选项卡样式也相应做变化

来源：互联网发布：开淘宝店如何交保证金编辑：程序博客网时间：2024/04/26 18:59

最近遇到个要求是实现鼠标滚滚动时，选项卡样式相应变化。JS代码附上。

$("选项卡的选择器").click(function () {        $("选项卡的选择器").css('background', '');        $(this).css('background', '#fff');        click="already_click_type";//设置一个全局变量，说明已点击    });    window.onscroll=function(){        if(click!="already_click_type"){            var scoll_top=$("body").scrollTop();//滚动的高度            var page_href=location.href;                       for (var i =0 ;i <=$("右侧内容区标题").length; i++) {                //var p= $("右侧内容区标题").eq(i).text();                if(i!=$("右侧内容区标题").length){                    var height=$("右侧内容区标题").eq(i).get(0).offsetTop-5;//获取右侧内容区标题的高度                    if (i==$("右侧内容区标题").length-1) {                    var height_1=document.body.scrollHeight;//最大的滚动高度                    }else{                        var height_1=$("ul.custom-tag-list-goods-list>p.custom-tag-list-title").eq(i+1).get(0).offsetTop;                    }                }

//进行判断后进行修改样式                if(scoll_top>=height&&scoll_top<height_1){                    $("ul.custom-tag-list-side-menu>li>a.current").eq(i+1).css({background:"#fff"});                    $("ul.custom-tag-list-side-menu>li>a.current").eq(i+1).siblings().css({background:""});                }             }        }        click=""    };

0 0