xdesign-vue-next
Version:
XDesign Component for vue-next
1 lines • 3.08 kB
Source Map (JSON)
{"version":3,"file":"getScrollbarWidth.mjs","sources":["../../../../src/_common/js/utils/getScrollbarWidth.ts"],"sourcesContent":["/**\n * 计算滚动条宽度的方法\n * 新建一个带有滚动条的 div 元素，通过该元素的 offsetWidth 和 clientWidth 的差值即可获得\n * CSS 中设置了 -webkit-scrollbar { width: 6px; height: 6px }，固定浏览器滚动条宽度，仅限 Chrome/Safari\n * Safari UA\n * \"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7)\n * AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.1 Safari/605.1.15\"\n * Chrome UA\n * Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7)\n * AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.109 Safari/537.36\n * FireFox UA\n * Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:94.0) Gecko/20100101 Firefox/94.0\n * IE UA\n * \"Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0; SLCC2;\n * .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0)\"\n */\nimport { getIEVersion } from './helper';\n\nexport function getScrollbarWidthWithCSS() {\n const defaultScrollbarWidth = 6;\n if (typeof navigator === 'undefined' || !navigator) return defaultScrollbarWidth;\n if (/(Chrome|Safari)/i.test(navigator.userAgent)) return defaultScrollbarWidth;\n const scrollDiv = document.createElement('div');\n scrollDiv.style.cssText = 'width: 99px; height: 99px; overflow: scroll; position: absolute; top: -9999px;';\n document.body.appendChild(scrollDiv);\n let scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;\n document.body.removeChild(scrollDiv);\n // 火狐浏览器需要再减去 4\n if (/Firefox/.test(navigator.userAgent)) {\n scrollbarWidth -= 4;\n }\n if (getIEVersion() <= 11) {\n scrollbarWidth = 12;\n }\n return scrollbarWidth;\n}\n\n// 获取 body 下滚动条宽度\nexport function getScrollbarWidth() {\n const scrollDiv = document.createElement('div');\n scrollDiv.style.cssText = 'width: 99px; height: 99px; overflow: scroll; position: absolute; top: -9999px;';\n document.body.appendChild(scrollDiv);\n const scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;\n document.body.removeChild(scrollDiv);\n return scrollbarWidth;\n}\n"],"names":["scrollDiv","document","scrollbarWidth"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAkBO,SAAA,wBAAA,GAAA;;;;AAIC,EAAA,IAAA,SAAA,GAAA,QAAA,CAAA,aAAA,CAAA,KAAA,CAAA,CAAA;AACNA,EAAAA,SAAAA,CAAAA,KAAAA,CAAAA,OAAAA,GAAAA,gFAAAA,CAAAA;AACSC,EAAAA,QAAAA,CAAAA,IAAAA,CAAAA,WAAAA,CAAAA,SAAAA,CAAAA,CAAAA;;AAEAA,EAAAA,QAAAA,CAAAA,IAAAA,CAAAA,WAAAA,CAAAA,SAAAA,CAAAA,CAAAA;;AAGWC,IAAAA,cAAAA,IAAAA,CAAAA,CAAAA;AACpB,GAAA;AACI,EAAA,IAAA,YAAA,EAAA,IAAA,EAAA,EAAA;AACeA,IAAAA,cAAAA,GAAAA,EAAAA,CAAAA;AACnB,GAAA;AACO,EAAA,OAAA,cAAA,CAAA;AACT,CAAA;AAGO,SAAA,iBAAA,GAAA;AACC,EAAA,IAAA,SAAA,GAAA,QAAA,CAAA,aAAA,CAAA,KAAA,CAAA,CAAA;AACNF,EAAAA,SAAAA,CAAAA,KAAAA,CAAAA,OAAAA,GAAAA,gFAAAA,CAAAA;AACSC,EAAAA,QAAAA,CAAAA,IAAAA,CAAAA,WAAAA,CAAAA,SAAAA,CAAAA,CAAAA;;AAEAA,EAAAA,QAAAA,CAAAA,IAAAA,CAAAA,WAAAA,CAAAA,SAAAA,CAAAA,CAAAA;AACF,EAAA,OAAA,cAAA,CAAA;AACT;;;;"}