Полная прокрутка страницы

Question

Мне нужно было бы выполнить гладкую полную прокрутку страницы. Я уже сделал это на этой странице:

http://superhostitel.cz/sluzby

Но когда я прокручиваю с колесом больше, он будет перемещаться на большее количество страниц. Пожалуйста, как я могу настроить прокрутку только одной страницы?

Мой код:

$(document).ready(function() { 
    var divs = $('.service'); 
    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++; 
     } 
     //console.log(div, dir, divs.length); 
     $('html,body').stop().animate({ 
      scrollTop: divs.eq(div).offset().top 
     }, 800); 
     return false; 
    }); 
    $(window).resize(function() { 
     $('html,body').scrollTop(divs.eq(div).offset().top); 
    }); 
}); 

Answer 1

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

Что-то вдоль этих линий должны работать (не проверял, но вы должны получить идею):

var running = false; 
var handler = function (e) { 
    if (running) { 
     return; 
    } 
    running = true; 
    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++; 
    } 
    //console.log(div, dir, divs.length); 
    $('html,body').stop().animate(
     { scrollTop: divs.eq(div).offset().top }, // properties 
     800,          // duration 
     "swing",         // easing (needed to use 4th argument) 
     function(){ running = false; }   // animation complete callback 
    ); 

    return false; 
}; 

$(document.body).on('DOMMouseScroll mousewheel', handler); 

Answer 2

Вы можете сделать это по-другому:

1. Определить максимальные страницы (Fе) 10 страниц.
2. Вы можете выбрать фактическую страницу, начиная с 1 (не 0 для удобного кодирования)
3. Отключить нормальный свиток.
4. Когда вызывается прокрутка и место назначения не расширяет максимальные страницы и не разрешает минимальную страницу (не вводить страницу №0) - прокрутка
5. Динамическое определение размера окна.

6. Имейте славный день.

7. Если вы хотите какую-то прокрутки на конкретном элементе - рекомендую вам this

ПРИМЕЧАНИЯ: Используйте setInterval (F, 1000/60) для анимации, которая принимает пользователь на кратность clientHeight и фактической странице.