49 lines
1.2 KiB
JavaScript
49 lines
1.2 KiB
JavaScript
// Here's a brief sketch of the class
|
|
// with things that you'll need anyway
|
|
export default class HoverIntent {
|
|
|
|
constructor({
|
|
sensitivity = 0.1, // speed less than 0.1px/ms means "hovering over an element"
|
|
interval = 100, // measure mouse speed once per 100ms: calculate the distance between previous and next points
|
|
elem,
|
|
over,
|
|
out
|
|
}) {
|
|
this.sensitivity = sensitivity;
|
|
this.interval = interval;
|
|
this.elem = elem;
|
|
this.over = over;
|
|
this.out = out;
|
|
|
|
// make sure "this" is the object in event handlers.
|
|
this.onMouseMove = this.onMouseMove.bind(this);
|
|
this.onMouseOver = this.onMouseOver.bind(this);
|
|
this.onMouseOut = this.onMouseOut.bind(this);
|
|
|
|
// assign the handlers
|
|
elem.addEventListener("mouseover", this.onMouseOver);
|
|
elem.addEventListener("mouseout", this.onMouseOut);
|
|
|
|
// continue from this point
|
|
}
|
|
|
|
onMouseOver(event) {
|
|
console.log("OVER", event);
|
|
/* ... */
|
|
}
|
|
|
|
onMouseOut(event) {
|
|
/* ... */
|
|
}
|
|
|
|
onMouseMove(event) {
|
|
/* ... */
|
|
}
|
|
|
|
|
|
destroy() {
|
|
/* your code to "disable" the functionality, remove all handlers */
|
|
/* it's needed for the tests to work */
|
|
}
|
|
|
|
}
|