滑动到指定div自动添加样式样式固定

示例1：
需要使用jquery

1.                 <style>
   
2.                         .myFixed{
   
3.                                 position:fixed;
   
4.                                 top:0px;
   
5.                         }
   
6.                 </style>
   
7.                         <script src="js/jquery-1.11.3.min.js"></script>
   
8.         <script>
   
9.                 function scrollLis(){
   
10.                  var toTop = offs.top-$(window).scrollTop();
    
11.                  console.log(toTop)
    
12.                  if(toTop==0||toTop<0){
    
13.                   if(!$('#fixed').hasClass('myFixed'))
    
14.                   $('#fixed').addClass('myFixed');
    
15.                  }else{
    
16.                   $('#fixed').removeClass('myFixed');
    
17.                  }
    
18.                 }
    
19.                 var offs=$('#fixed').offset();
    
20.                 $(window).scroll(function(){
    
21.                  scrollLis();
    
22.                 });
    
23.         </script>

复制代码

示例2：
获取id自动添加 以下代码一个页面只能一个有效

1. <script>
   
2.   function scrollLis(){
   
3.     var t = document.documentElement.scrollTop || document.body.scrollTop;
   
4.     console.log(t-offs)
   
5.    if(t>=offs){
   
6.     fixed.classList.add("myFixed")
   
7.    }else{
   
8.     fixed.classList.remove("myFixed")
   
9.    }
   
10.   }
    
11.   var fixed = document.getElementById("fixed");
    
12.   var offs=fixed.offsetTop
    
13.   window.onscroll=function(){
    
14.    scrollLis();
    
15.   };
    
16. </script>

复制代码

示例3：
可获取多个id

1.                 <style>
   
2.                         .myFixed{
   
3.                                 position:fixed;
   
4.                                 top:0px;
   
5.                         }
   
6.                 </style>
   
7.         <script>
   
8.                 function scrollLis(){
   
9.                          var t = document.documentElement.scrollTop || document.body.scrollTop;
   
10.                         if(t>=offs){
    
11.                                 fixed.classList.add("myFixed")
    
12.                         }else{
    
13.                                 fixed.classList.remove("myFixed")
    
14.                         }
    
15.                         if(t>=offs1){
    
16.                                 fixed1.classList.add("myFixed")
    
17.                         }else{
    
18.                                 fixed1.classList.remove("myFixed")
    
19.                         }
    
20.                 }
    
21.                 var fixed = document.getElementById("fixed");
    
22.                 var fixed1 = document.getElementById("fixed1");
    
23.                 var offs=fixed.offsetTop
    
24.                 var offs1=fixed1.offsetTop
    
25.                 window.onscroll=function(){
    
26.                  scrollLis();
    
27.                 };
    
28.         </script>

复制代码