mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-09-29 06:49:06 +02:00
Code Issues Releases Wiki Activity

Scrollbar: respect the initial body overflow value (#33706)

Browse Source 
* add method to handle overflow on body element & tests
* replace duplicated code on modal/offcanvas tests
This commit is contained in:
GeoSot
2021-04-25 06:50:16 +03:00
committed by GitHub
parent e2294ff090
commit d381820d16
5 changed files with 113 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
js/src/util/scrollbar.js
View File

@@ -18,11 +18,21 @@ const getWidth = () => {
}
const hide = (width = getWidth()) => {
document.body.style.overflow = 'hidden'
_disableOverFlow()
// give padding to element to balances the hidden scrollbar width
_setElementAttributes('body', 'paddingRight', calculatedValue => calculatedValue + width)
// trick: We adjust positive paddingRight and negative marginRight to sticky-top elements, to keep shown fullwidth
_setElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight', calculatedValue => calculatedValue + width)
_setElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight', calculatedValue => calculatedValue - width)
_setElementAttributes('body', 'paddingRight', calculatedValue => calculatedValue + width)
}
const _disableOverFlow = () => {
const actualValue = document.body.style.overflow
if (actualValue) {
Manipulator.setDataAttribute(document.body, 'overflow', actualValue)
}
document.body.style.overflow = 'hidden'
}
const _setElementAttributes = (selector, styleProp, callback) => {
@@ -41,10 +51,10 @@ const _setElementAttributes = (selector, styleProp, callback) => {
}
const reset = () => {
document.body.style.overflow = 'auto'
_resetElementAttributes('body', 'overflow')
_resetElementAttributes('body', 'paddingRight')
_resetElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight')
_resetElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight')
_resetElementAttributes('body', 'paddingRight')
}
const _resetElementAttributes = (selector, styleProp) => {