Add event onWheel (#1)

* add handle weel
asmyshlyaev177 · Jul 23, 2018 · 3cc186f · 3cc186f
1 parent 64f98fd
commit 3cc186f
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 3 deletions.
diff --git a/build/index.js b/build/index.js
diff --git a/examples/package.json b/examples/package.json
@@ -10,7 +10,7 @@
     "react-scripts": "1.1.4"
   },
   "scripts": {
-    "start": "PORT=3005 react-scripts start",
+    "start": "set PORT=3005 && react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test --env=jsdom",
     "eject": "react-scripts eject",

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-horizontal-scrolling-menu",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "Scrolling horizontal menu component for React, support mouse and touch devices.",
   "esnext": "src/index.js",
   "browser": "build/index.js",

diff --git a/src/scrollMenu.js b/src/scrollMenu.js
@@ -453,6 +453,16 @@ export class ScrollMenu extends React.Component {
     return offset;
   };
 
+  handleWheel = e => {
+    e.stopPropagation();
+    e.preventDefault();
+    if (e.deltaY < 0) {
+      this.handleArrowClick()
+    } else {
+      this.handleArrowClick(false)
+    }
+  }
+
   handleArrowClick = (left = true) => {
     const { alignCenter } = this.props;
     const {
@@ -601,6 +611,7 @@ export class ScrollMenu extends React.Component {
       <div
         className={menuClass}
         style={ menuStyle }
+        onWheel = {(e) => this.handleWheel(e)}
       >
 
         {arrowLeft &&