Как прокрутить до определенной точки в документе?

Question

В качестве примера, я использую эту страницу: http://www.bulldoggin.com/home/

Как вы можете видеть, что нет никакого способа, чтобы просто прокрутить, каждый раз, когда вы прокручиваетесь автоматически переходит к определенной точке в документе. Нельзя идти «на полпути».

Есть ли способ решить это, используя javascript, jQuery или что-нибудь еще? Я не хочу использовать кнопки для перехода к определенной точке страницы, но я хочу добиться этого, прокручивая, используя колесико мыши, стрелку вниз и т. Д.?

Answer 1

Вот фрагмент кода, который делает то, что вы хотите, он по-прежнему нуждается в большой работе, но он должен помочь вам приступить к работе.

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>