mirror of
https://github.com/webslides/WebSlides.git
synced 2025-08-21 04:12:01 +02:00
Adding scroll to plugin
This commit is contained in:
@@ -185,7 +185,7 @@ export default class WebSlides {
|
|||||||
}
|
}
|
||||||
|
|
||||||
DOM.unlockScroll();
|
DOM.unlockScroll();
|
||||||
callback.call(this, nextSlide);
|
setTimeout(() => { callback.call(this, nextSlide); }, 150);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@@ -0,0 +1,50 @@
|
|||||||
|
import ScrollHelper from '../utils/scroll-to';
|
||||||
|
|
||||||
|
const MIN_WHEEL_DELTA = 40;
|
||||||
|
|
||||||
|
export default class Scroll {
|
||||||
|
/**
|
||||||
|
* Scroll handler for the WebSlides.
|
||||||
|
* @param {WebSlides} wsInstance The WebSlides instance
|
||||||
|
*/
|
||||||
|
constructor(wsInstance) {
|
||||||
|
/**
|
||||||
|
* @type {WebSlides}
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
this.ws_ = wsInstance;
|
||||||
|
|
||||||
|
this.scrollContainer_ = ScrollHelper.getScrollableContainer();
|
||||||
|
this.isGoingUp_ = false;
|
||||||
|
|
||||||
|
if (this.ws_.isVertical) {
|
||||||
|
this.scrollContainer_.addEventListener(
|
||||||
|
'wheel', this.onMouseWheel_.bind(this));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Reacts to the wheel event. Detects whether is going up or down and decides
|
||||||
|
* if it needs to move the slide based on the amount of delta.
|
||||||
|
* @param {WheelEvent} event The Wheel Event.
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
onMouseWheel_(event) {
|
||||||
|
if (this.ws_.isMoving) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { deltaY: wheelDelta } = event;
|
||||||
|
this.isGoingUp_ = wheelDelta < 0;
|
||||||
|
|
||||||
|
if (Math.abs(wheelDelta) >= MIN_WHEEL_DELTA) {
|
||||||
|
if (this.isGoingUp_) {
|
||||||
|
this.ws_.goPrev();
|
||||||
|
} else {
|
||||||
|
this.ws_.goNext();
|
||||||
|
}
|
||||||
|
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
@@ -1,6 +1,6 @@
|
|||||||
import Easings from './easing';
|
import Easings from './easing';
|
||||||
|
|
||||||
let SCROLLABLE_CONTAINER;
|
let SCROLLABLE_CONTAINER = getScrollableContainer();
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Returns the correct DOM element to be used for scrolling the
|
* Returns the correct DOM element to be used for scrolling the
|
||||||
|
Reference in New Issue
Block a user