Wie scrollt man zu einem bestimmten Punkt im Dokument?

Question

Als Beispiel verwende ich diese Seite: http://www.bulldoggin.com/home/

Wie Sie sehen können, gibt es keine Möglichkeit, nur zu bewegen, jedes Mal, wenn Sie es automatisch zu einem bestimmten Punkt in dem Dokument springt blättern. Es gibt keine Möglichkeit, "halbwegs" zu gehen.

Gibt es eine Möglichkeit, diese mit Hilfe von JavaScript, jQuery oder irgendetwas zu lösen? Ich will nicht, Tasten verwenden, um einen bestimmten Punkt auf der Seite zu springen, aber ich möchte dies erreichen durch Scrollen, das Mausrad verwenden, auf dem Pfeil nach unten-Taste usw.?

Answer 1

Hier ist ein Code-Snippet, das tut, was Sie wollen, es muss noch eine Menge Arbeit, aber es sollte Ihnen den Einstieg erleichtern.

var lastScrollTop = 1; 
 
var doneScrolling = true; 
 

 
$(window).scroll(function(event){ 
 
    var st = $(this).scrollTop(); 
 
    if (doneScrolling == true) { 
 
    doneScrolling = false 
 
    if (st > lastScrollTop){ 
 
    $('html, body').animate({ 
 
     scrollTop: $("p").offset().top 
 
    }, 2000, function(){ 
 
    doneScrolling = true 
 
    }); 
 
    } else { 
 
     $('html, body').animate({ 
 
     scrollTop: $("p").last().offset().top 
 
    }, 2000, function(){ 
 
    doneScrolling = true 
 
    }); 
 
    } 
 
    lastScrollTop = st; 
 
    } 
 
});

div { 
 
    height: 1000px; 
 
} 
 

 
p { 
 
    height: 100px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <p>Test 1</p> 
 
    <p>Test 2</p> 
 
    <p>Test 3</p> 
 
    <p>Test 4</p> 
 
    <p>Test 5</p> 
 
    <p>Test 6</p> 
 
    <p>Test 7</p> 
 
    <p>Test 8</p> 
 
    <p>Test 9</p> 
 
    <p id="last">Test 10</p> 
 
</div>