4fa4303979e5df9a5dce19afa29431b53085caab23993b6a5843d4025c31b0f80ce752bfad5725383450ce2a58bfcd2b1b67d18521233cb85eabc3d8a94a7f-exec 1.1 KB

12345678910111213141516171819202122232425262728293031323334
  1. function findScrollParents($el) {
  2. const $scrollParents = []
  3. let $parent = $el.parentNode
  4. while ($parent && $parent.nodeName !== 'BODY' && $parent.nodeType === document.ELEMENT_NODE) {
  5. if (isScrollElment($parent)) $scrollParents.push($parent)
  6. $parent = $parent.parentNode
  7. }
  8. $scrollParents.push(window)
  9. return $scrollParents
  10. }
  11. function isScrollElment($el) {
  12. // Firefox wants us to check `-x` and `-y` variations as well
  13. const { overflow, overflowX, overflowY } = getComputedStyle($el)
  14. return /(auto|scroll|overlay)/.test(overflow + overflowY + overflowX)
  15. }
  16. export function setupResizeAndScrollEventListeners($el, listener) {
  17. const $scrollParents = findScrollParents($el)
  18. window.addEventListener('resize', listener, { passive: true })
  19. $scrollParents.forEach(scrollParent => {
  20. scrollParent.addEventListener('scroll', listener, { passive: true })
  21. })
  22. return function removeEventListeners() {
  23. window.removeEventListener('resize', listener, { passive: true })
  24. $scrollParents.forEach($scrollParent => {
  25. $scrollParent.removeEventListener('scroll', listener, { passive: true })
  26. })
  27. }
  28. }