我爱编程

滚动监听楼层点亮

2018-06-07  本文已影响3人  孤单的天使

需求:楼层点亮,但是不知道楼层高度,也不知道楼层数量。

意思就是要写一个通用方法

首先给个图看效果吧

效果图

上代码

var titles =document.getElementsByClassName('col-or');

//为什么不用jq呢这里,因为我要用getBoundingClientRect()方法,jq没有封装这个方法(好像是),这个怎么不写在下面的$(document).scroll(function () 里面呢,因为优化,

$(document).scroll(function () {

arry_titles_top()

function arry_titles_top() {

for (i=0;i

var checke_top =titles[i].getBoundingClientRect().top;

if(checke_top>40&&checke_top<200){

add_active(i);

}

}

}

function add_active(i) {

x=i+1

        console.log($(".content-fixed-top .top>div:nth-child("+x+")"))

$(".content-fixed-top .top>div:nth-child("+x+")").addClass("active")

.siblings().removeClass("active");

}

})


上一篇下一篇

猜你喜欢

热点阅读