1
0
Эх сурвалжийг харах

feat: isScrollable function

Sven 1 жил өмнө
parent
commit
db5cded

+ 5 - 0
.changeset/calm-starfishes-sell.md

@@ -0,0 +1,5 @@
+---
+"@sv443-network/userutils": minor
+---
+
+Added `isScrollable()` to check whether an element has a horizontal or vertical scroll bar

+ 1 - 0
README-greasyfork.md

@@ -27,6 +27,7 @@ If you like using this library, please consider [supporting the development ❤
     - [interceptEvent()](https://github.com/Sv443-Network/UserUtils#interceptevent) - conditionally intercepts events registered by `addEventListener()` on any given EventTarget object
     - [interceptWindowEvent()](https://github.com/Sv443-Network/UserUtils#interceptwindowevent) - conditionally intercepts events registered by `addEventListener()` on the window object
     - [amplifyMedia()](https://github.com/Sv443-Network/UserUtils#amplifymedia) - amplify an audio or video element's volume past the maximum of 100%
+    - [isScrollable()](https://github.com/Sv443-Network/UserUtils#isscrollable) - check if an element has a horizontal or vertical scroll bar
 - Math:
     - [clamp()](https://github.com/Sv443-Network/UserUtils#clamp) - constrain a number between a min and max value
     - [mapRange()](https://github.com/Sv443-Network/UserUtils#maprange) - map a number from one range to the same spot in another range

+ 9 - 0
lib/dom.ts

@@ -164,3 +164,12 @@ export function amplifyMedia<TElem extends HTMLMediaElement>(mediaElement: TElem
 
   return result;
 }
+
+/** Checks if an element is scrollable in the horizontal and vertical directions */
+export function isScrollable(element: Element) {
+  const { overflowX, overflowY } = getComputedStyle(element);
+  return {
+    vertical: (overflowY === "scroll" || overflowY === "auto") && element.scrollHeight > element.clientHeight,
+    horizontal: (overflowX === "scroll" || overflowX === "auto") && element.scrollWidth > element.clientWidth,
+  };
+}