滚动条的一次移动改变屏幕的位置

【问题标题】：Change the position of the screen with once movement of scrolling bar滚动条的一次移动改变屏幕的位置
【发布时间】：2016-03-01 20:31:23
【问题描述】：

您好我已经制作了两个div，每个div的高度都覆盖了孔页。这两个div位于彼此下方。我希望当用户降低鼠标滚动条时页面直接转到第二个div的开头并且抬起滚动条时，页面直接转到第一个 div 的开头。请帮助我理解如何做到这一点非常感谢。

#up_page{
width:100%;
height:50%;
background-color:red;
}
#down_page{
width:100%;
height:50%;
background-color:blue;
}

<div style="width: 100%; height: 1500px;">
		<div id="up_page">	
		</div>
		<div id="down_page">	
		</div>
	</div>

【问题讨论】：

标签： javascript html css

【解决方案1】：

找到另一个帖子，和你的问题一样。

Stackoverflow

        var winH = $(window).height();
        $('.page').height(winH);

        var c = 0;
        var pagesN = $('.page').length;
        var canScroll = true;

        $(document).bind('mousewheel', function(ev, delta) {
         ev.preventDefault();
         if(!canScroll) return;
         delta>0 ? --c : ++c ;    
         if(c===-1){
         c=0;
         }else if(c===pagesN){
          c=pagesN-1;
         }
         canScroll = false;
           var pagePos = $('.page').eq(c).position().top;       
          $('html, body').stop().animate({scrollTop: pagePos},700,     
      
         function(){
         canScroll = true;
         });
         return false; 

         });

这是一个使用 jQuery 的示例：

工作jsfiddle

希望这就是您想要的。

【讨论】：