I guess you are having that trouble with laptops and their trackpads rather than with the mouse wheel. Am I correct? Or maybe, with the Apple mouse, which is like a trackpad in terms of scrolling.
Well, just to let you know, the problem is not in the $(window).scroll(function(e){
function, but in the MouseWheelHandler()
. The .scroll
function is only used when the option autoScrolling
is set to false
as you can see in the first condition.
Said this, the MouseWheelHandler()
function is fired every time it detects any scroll on the mousewheel or in the trackpad. A way to avoid firing it on the first scroll is just creating a counter for it.
You have to be careful, as the scrolling is much more sensitive in trackpads than in normal mousewheels, so, try it with both devices before defining the minimum number of scrolls that you want to use.
I've defined a new variable set to 0:
var scrolls = 0;
Then, inside MouseWheelHandler()
, I've added a new condition scrolls > 2
.
if(options.autoScrolling && scrolls>2){
This way, we will only fire the events if we scroll more than 3 times, which i believe is enough for mouse wheels.
If we don't enter in the condition, then we increment the variable:
}else{
scrolls++;
};
Here's the working demo: http://jsfiddle.net/prYUq/2/
And here the full modified function:
var scrolls = 0;
function MouseWheelHandler() {
return function (e) {
if (options.autoScrolling && scrolls > 2) {
// cross-browser wheel delta
e = window.event || e;
var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
e.wheelData
console.log("e.wheelDelta: " + e.wheelDelta);
console.log("-e.detail: " + e.detail);
if (!isMoving) { //if theres any #
var scrollable = $('.section.active').find('.scrollable');
//scrolling down?
if (delta < 0) {
if (scrollable.length > 0) {
//is the scrollbar at the end of the scroll?
if (isScrolled('bottom', scrollable)) {
$.fn.fullpage.moveSlideDown();
} else {
return true; //normal scroll
}
} else {
$.fn.fullpage.moveSlideDown();
}
}
//scrolling up?
else {
if (scrollable.length > 0) {
//is the scrollbar at the start of the scroll?
if (isScrolled('top', scrollable)) {
$.fn.fullpage.moveSlideUp();
} else {
return true; //normal scroll
}
} else {
$.fn.fullpage.moveSlideUp();
}
}
}
scrolls = 0;
return false;
} else {
scrolls++;
};
}
}
If you have specific questions or request for the plugin, don't forget about the issues forum on github for this plugin: https://github.com/alvarotrigo/fullPage.js/issues?state=open
I Hope it helps.