基於鼠標滾輪的全頁滾動

我正在嘗試基於鼠標滾輪進行一個頁面滾動。在鼠標向下的位置，下面的部分向上移動，向上移動鼠標時，上面的部分向下移動。有五個部分，我使用初始值爲1的變量'a'，並以mousedown a爲增量，並將該值作爲該部分的id（例如：a = 2,document.getElementbyId(a)應該稱爲部分2）發送。這是預期的結果。基於鼠標滾輪的全頁滾動

<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<style> 
section { height: 100vh; 
border:1px solid black; } 
.pushupsections{ 
    margin-bottom:-100vh; 
} 
</style> 
</head> 

<body> 
<section id=1>1</section> 
<section id="2">2</section> 
<section id="3">3</section> 
<section id="4">4</section> 
<section id="5">5</section> 
<script> 
$(document).ready(function() { 
var a=1; 
$('body').bind('mousewheel', function(e){ 
// var e; 
    if(e.originalEvent.wheelDelta /120 > 0) { 
     // alert(1); 
     if(a>1){    
     a--; 

     //$(a).addClass("pushupsections"); 
     // document.getElementById(a).addclass("pushupsections"); 
     } 
    } 
    else{   
     if(a<5){ 
     a++; 

      // document.getElementById(a).addclass("pushupsections"); 
      }   
    } 
}); 
}); 
</script> 

</body> 
</html>

來源

2017-06-22 vineeth