mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-06 13:46:42 +02:00
Code Issues Releases Wiki Activity

ScrollBar.js. Minor refactoring and add test (#35492)

Browse Source
This commit is contained in:
GeoSot
2021-12-09 15:05:50 +02:00
committed by GitHub
parent 2a7015e630
commit 4fd5539c75
2 changed files with 38 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -15,6 +15,8 @@ import { isElement } from './index'
const SELECTOR_FIXED_CONTENT = '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top'
const SELECTOR_STICKY_CONTENT = '.sticky-top'
const PROPERTY_PADDING = 'paddingRight'
const PROPERTY_MARGIN = 'marginRight'
/**
* Class definition
@@ -36,17 +38,17 @@ class ScrollBarHelper {
const width = this.getWidth()
this._disableOverFlow()
// give padding to element to balance the hidden scrollbar width
this._setElementAttributes(this._element, 'paddingRight', calculatedValue => calculatedValue + width)
this._setElementAttributes(this._element, PROPERTY_PADDING, calculatedValue => calculatedValue + width)
// trick: We adjust positive paddingRight and negative marginRight to sticky-top elements to keep showing fullwidth
this._setElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight', calculatedValue => calculatedValue + width)
this._setElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight', calculatedValue => calculatedValue - width)
this._setElementAttributes(SELECTOR_FIXED_CONTENT, PROPERTY_PADDING, calculatedValue => calculatedValue + width)
this._setElementAttributes(SELECTOR_STICKY_CONTENT, PROPERTY_MARGIN, calculatedValue => calculatedValue - width)
}
reset() {
this._resetElementAttributes(this._element, 'overflow')
this._resetElementAttributes(this._element, 'paddingRight')
this._resetElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight')
this._resetElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight')
this._resetElementAttributes(this._element, PROPERTY_PADDING)
this._resetElementAttributes(SELECTOR_FIXED_CONTENT, PROPERTY_PADDING)
this._resetElementAttributes(SELECTOR_STICKY_CONTENT, PROPERTY_MARGIN)
}
isOverflowing() {
@@ -86,10 +88,11 @@ class ScrollBarHelper {
const value = Manipulator.getDataAttribute(element, styleProp)
if (typeof value === 'undefined') {
element.style.removeProperty(styleProp)
} else {
Manipulator.removeDataAttribute(element, styleProp)
element.style[styleProp] = value
return
}
Manipulator.removeDataAttribute(element, styleProp)
element.style[styleProp] = value
}
this._applyManipulationCallback(selector, manipulationCallBack)
@@ -98,10 +101,11 @@ class ScrollBarHelper {
_applyManipulationCallback(selector, callBack) {
if (isElement(selector)) {
callBack(selector)
} else {
for (const sel of SelectorEngine.find(selector, this._element)) {
callBack(sel)
}
return
}
for (const sel of SelectorEngine.find(selector, this._element)) {
callBack(sel)
}
}
}