Wie scrollt man automatisch zum nächsten Abschnitt in jQuery?

Question

Sehen Sie das Snippet .. hat einige Abschnitte, die die volle Größe des Ansichtsfensters enthalten. Wenn der Benutzer scrollt, sollte er automatisch zum nächsten der Klasse ".section" scrollen.

Englisch ist nicht meine Hauptsprache, sorry für einige Grammatikfehler oder so etwas.

$(document).ready(function(e){ 
 

 
    var position = $(window).scrollTop(); 
 

 
    $(window).scroll(function() { 
 
     
 
     var scroll = $(window).scrollTop(); 
 

 
     if(scroll > position) { 
 
     
 
     //scrolling down 
 
      
 
     } else { 
 
     //scrolling up 
 
     } 
 
     
 
     position = scroll; 
 

 
    }); 
 
});

html,body { margin:0;padding:0;width: 100%;} 
 

 
.section { 
 
    width: 100%; 
 
    height:100vh; 
 
    background-color:#000; 
 
} 
 

 
.section:nth-child(odd) { background-color:#fff;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<section id="Home" class="section"></section> 
 
    <section id="Home" class="section"></section> 
 
    <section id="Home" class="section"></section> 
 
    <section id="Home" class="section"></section> 
 
    <section id="Home" class="section"></section>

Answer 1

Zuerst würde ich die DIVs Nummer, nachdem ich den JQuery-Code mit belebt atribute verwenden würde ich Tasten verwenden, um die Funktion und einen Zähler rufen Sie das nächste div zu gehen

<section id="H1" class="section"><button>btn</button></section> 

<section id="H2" class="section"><button>btn</button></section> 

<section id="H3" class="section"><button>btn</button></section> 

<section id="H4" class="section"><button>btn</button></section> 


<script> 
var ndiv=1; 
    $("button").on('click', function(event) { 

    event.preventDefault(); 

    // Store hash 
    var hash = "#H"+ ndiv; 

     // Using jQuery's animate() method to add smooth page scroll 
     // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area 
     $('html, body').animate({ 
     scrollTop: $(hash).offset().top 
     }, 800, function(){ 

     window.location.hash ="H"+ ndiv; 
     }); 

ndiv++; 
}); 
</script>