1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-09-26 21:39:08 +02:00

Make carousel indicators actual buttons

This commit is contained in:
Patrick H. Lauke
2021-01-03 13:06:58 +02:00
committed by XhmikosR
parent 1fd34a1a2c
commit a882614c45
9 changed files with 70 additions and 59 deletions

View File

@@ -90,6 +90,7 @@ const SELECTOR_ITEM = '.carousel-item'
const SELECTOR_ITEM_IMG = '.carousel-item img'
const SELECTOR_NEXT_PREV = '.carousel-item-next, .carousel-item-prev'
const SELECTOR_INDICATORS = '.carousel-indicators'
const SELECTOR_INDICATOR = '[data-bs-target]'
const SELECTOR_DATA_SLIDE = '[data-bs-slide], [data-bs-slide-to]'
const SELECTOR_DATA_RIDE = '[data-bs-ride="carousel"]'
@@ -405,18 +406,21 @@ class Carousel extends BaseComponent {
_setActiveIndicatorElement(element) {
if (this._indicatorsElement) {
const indicators = SelectorEngine.find(SELECTOR_ACTIVE, this._indicatorsElement)
const activeIndicators = SelectorEngine.find(SELECTOR_ACTIVE, this._indicatorsElement)
for (let i = 0; i < indicators.length; i++) {
indicators[i].classList.remove(CLASS_NAME_ACTIVE)
for (let i = 0; i < activeIndicators.length; i++) {
activeIndicators[i].classList.remove(CLASS_NAME_ACTIVE)
activeIndicators[i].removeAttribute('aria-current')
}
const nextIndicator = this._indicatorsElement.children[
this._getItemIndex(element)
]
const indicators = SelectorEngine.find(SELECTOR_INDICATOR, this._indicatorsElement)
if (nextIndicator) {
nextIndicator.classList.add(CLASS_NAME_ACTIVE)
for (let i = 0; i < indicators.length; i++) {
if (Number.parseInt(indicators[i].getAttribute('data-bs-slide-to'), 10) === this._getItemIndex(element)) {
indicators[i].classList.add(CLASS_NAME_ACTIVE)
indicators[i].setAttribute('aria-current', 'true')
break
}
}
}
}