Home › Forums › JavaScript › Scrolling to next section with javascript on body{overflow:hidden} › Reply To: Scrolling to next section with javascript on body{overflow:hidden}
February 23, 2015 at 6:20 pm
#196649
Shikkediel
Participant
I like to use as few plugins as possible but I am a fan of mousewheel.
Made something similar recently to what you are trying to do :
var current = 1, aim;
var level = // number of sections
$(window).mousewheel(function(turn, delta) {
var shift = true;
if (delta == 1 && current == 1 || delta == -1 && current == level) shift = false;
if (shift) {
if (delta == -1) {
aim = $($('.option').eq(current).attr('href'));
current++;
}
else {
aim = $($('.option').eq(current-2).attr('href'));
current--;
}
$('html, body').scrollTop(aim.offset().top);
}
});
It would obviously need some editing because it’s scrolling instantaneously (not animated). Plus it works with anchors for a CSS fallback. The option
class is that of the (anchor) links that are clicked. The complete code (preferably on codepen) would help for me to make specific adaptations to match the functionality.