From f14b6a0d479b30006811ce658112c74d595855a8 Mon Sep 17 00:00:00 2001 From: DanielApt Date: Mon, 22 Feb 2016 22:32:06 +0000 Subject: [PATCH] Allow children native scroll Partly uses @DEFusion's #459 pull-request. Closes #455 --- examples/children-native-scroll.html | 73 ++++++++++++++++++++++++++++ src/js/plugin/handler/mouse-wheel.js | 23 +++++---- 2 files changed, 86 insertions(+), 10 deletions(-) create mode 100644 examples/children-native-scroll.html diff --git a/examples/children-native-scroll.html b/examples/children-native-scroll.html new file mode 100644 index 0000000..5bd0273 --- /dev/null +++ b/examples/children-native-scroll.html @@ -0,0 +1,73 @@ + + + + + perfect-scrollbar example + + + + +
+
+ +
+ overflow: scroll +
  • One
  • Two
  • Three
  • Four
  • Five
  • Six
  • Seven
  • Eight
+
+
+ overflow: auto +
  • One
  • Two
  • Three
  • Four
  • Five
  • Six
  • Seven
  • Eight
+
+
+
+ + + diff --git a/src/js/plugin/handler/mouse-wheel.js b/src/js/plugin/handler/mouse-wheel.js index 587737c..8270cd3 100644 --- a/src/js/plugin/handler/mouse-wheel.js +++ b/src/js/plugin/handler/mouse-wheel.js @@ -55,20 +55,23 @@ function bindMouseWheelHandler(element, i) { return [deltaX, deltaY]; } - function shouldBeConsumedByTextarea(deltaX, deltaY) { - var hoveredTextarea = element.querySelector('textarea:hover'); - if (hoveredTextarea) { - var maxScrollTop = hoveredTextarea.scrollHeight - hoveredTextarea.clientHeight; + function shouldBeConsumedByChild(deltaX, deltaY) { + var child = element.querySelector('textarea:hover, .ps-child:hover'); + if (child) { + console.log(child); + if (child.tagName !== 'TEXTAREA' && !window.getComputedStyle(child).overflow.match(/(scroll|auto)/)) { + return false; + } + + var maxScrollTop = child.scrollHeight - child.clientHeight; if (maxScrollTop > 0) { - if (!(hoveredTextarea.scrollTop === 0 && deltaY > 0) && - !(hoveredTextarea.scrollTop === maxScrollTop && deltaY < 0)) { + if (!(child.scrollTop === 0 && deltaY > 0) && !(child.scrollTop === maxScrollTop && deltaY < 0)) { return true; } } - var maxScrollLeft = hoveredTextarea.scrollLeft - hoveredTextarea.clientWidth; + var maxScrollLeft = child.scrollLeft - child.clientWidth; if (maxScrollLeft > 0) { - if (!(hoveredTextarea.scrollLeft === 0 && deltaX < 0) && - !(hoveredTextarea.scrollLeft === maxScrollLeft && deltaX > 0)) { + if (!(child.scrollLeft === 0 && deltaX < 0) && !(child.scrollLeft === maxScrollLeft && deltaX > 0)) { return true; } } @@ -82,7 +85,7 @@ function bindMouseWheelHandler(element, i) { var deltaX = delta[0]; var deltaY = delta[1]; - if (shouldBeConsumedByTextarea(deltaX, deltaY)) { + if (shouldBeConsumedByChild(deltaX, deltaY)) { return; }