JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div class="section" style="background: yellow;"></div>
<div class="section" style="background: green;"></div>
<div class="section" style="background: blue;"></div>
<div class="section" style="background: red;"></div>
<div class="section" style="background: violet;"></div>
<div class="section" style="background: orange;"></div>
<div class="section" style="background: black;"></div>

CSS

.section {
  height: 100vh;
}

JavaScript

var divs = $('.section'); 
var dir = 'up'; // wheel scroll direction
var div = 0; // current div

$(document.body).on('DOMMouseScroll mousewheel', function (e) {
	if (e.originalEvent.detail > 0 || e.originalEvent.wheelDelta < 0) {
  	dir = 'down';
  } 
  else {
  	dir = 'up';
  }
  
  // find currently visible div :
  div = -1;
  divs.each(function(i){
  	if (div<0 && ($(this).offset().top >= $(window).scrollTop())) {
  		div = i;
  	}
	});
  
  if (dir == 'up' && div > 0) {
  	div--;
  }
  if (dir == 'down' && div < divs.length) {
  	div++;
  }
  
	if( $(window).scrollTop() < $(window).height() * 6 ) {
		window.onwheel = function(){ return false; };
  }
  
  $('html,body').stop().animate({
	  scrollTop: divs.eq(div).offset().top
  }, 600, function() {
		window.onwheel = function(){ return true; };
	});
  
  return false;
});

$(window).resize(function () {
	$('html,body').scrollTop(divs.eq(div).offset().top);
});