getScrollBarSize.js 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. exports.default = getScrollBarSize;
  6. exports.getTargetScrollBarSize = getTargetScrollBarSize;
  7. /* eslint-disable no-param-reassign */
  8. let cached;
  9. function getScrollBarSize(fresh) {
  10. if (typeof document === 'undefined') {
  11. return 0;
  12. }
  13. if (fresh || cached === undefined) {
  14. const inner = document.createElement('div');
  15. inner.style.width = '100%';
  16. inner.style.height = '200px';
  17. const outer = document.createElement('div');
  18. const outerStyle = outer.style;
  19. outerStyle.position = 'absolute';
  20. outerStyle.top = '0';
  21. outerStyle.left = '0';
  22. outerStyle.pointerEvents = 'none';
  23. outerStyle.visibility = 'hidden';
  24. outerStyle.width = '200px';
  25. outerStyle.height = '150px';
  26. outerStyle.overflow = 'hidden';
  27. outer.appendChild(inner);
  28. document.body.appendChild(outer);
  29. const widthContained = inner.offsetWidth;
  30. outer.style.overflow = 'scroll';
  31. let widthScroll = inner.offsetWidth;
  32. if (widthContained === widthScroll) {
  33. widthScroll = outer.clientWidth;
  34. }
  35. document.body.removeChild(outer);
  36. cached = widthContained - widthScroll;
  37. }
  38. return cached;
  39. }
  40. function ensureSize(str) {
  41. const match = str.match(/^(.*)px$/);
  42. const value = Number(match === null || match === void 0 ? void 0 : match[1]);
  43. return Number.isNaN(value) ? getScrollBarSize() : value;
  44. }
  45. function getTargetScrollBarSize(target) {
  46. if (typeof document === 'undefined' || !target || !(target instanceof Element)) {
  47. return {
  48. width: 0,
  49. height: 0
  50. };
  51. }
  52. const {
  53. width,
  54. height
  55. } = getComputedStyle(target, '::-webkit-scrollbar');
  56. return {
  57. width: ensureSize(width),
  58. height: ensureSize(height)
  59. };
  60. }