glatt nach unten scrollen zwischen divs

Question

Weiß nicht, ob jemand kann mir helfen, ich versuche en nach unten scrollen einen porfolio mit einem glatten Effekt zu bauen, ist dies die Wirkung, die ich zu tun pflege: https://studiorotate.com/case-study/seedlip

Answer 1

Schauen Sie sich diese tutorial by w3schools.com

Was Sie tun müssen: hinzufügen ids zu den Abschnitten Ihrer Seite:

<a href="#section2">Click Me to Smooth Scroll to Section 2 Below</a> 

<div class="main"> 
    <section></section> 
</div> 

<div class="main" id="section2"> 
    <section style="background-color:blue"></section> 
</div> 

Und dann fügen Sie die jquery-Datei zusammen mit dem Skript von w3schools etwa so:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script> 

$(document).ready(function(){ 
    // Add smooth scrolling to all links 
    $("a").on('click', function(event) { 

    // Make sure this.hash has a value before overriding default behavior 
    if (this.hash !== "") { 
     // Prevent default anchor click behavior 
     event.preventDefault(); 

     // Store hash 
     var hash = this.hash; 

     // 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(){ 

     // Add hash (#) to URL when done scrolling (default click behavior) 
     window.location.hash = hash; 
     }); 
    } // End if 
    }); 
}); 
</script> 

Und dann den <a href="#section2"></a> Tag nach dem Klicken, werden Sie glatt

hier ein jsfiddle für die gleichen # section2

gescrollt werden.