HTML-opmaak:

1. Voeg de data-bs-toggle="tooltip" toe attribuut toe aan het element waarvoor u tooltip wilt weergeven. Dit kan een knop, link of een ander geschikt element zijn.

```html

Voorbeeld Tooltip

```

Hier wordt de tooltiptitel rechtstreeks in de opmaak van het element gespecificeerd. U kunt ook aangepaste gegevenskenmerken zoals `data-bs-title` instellen om tooltip-inhoud dynamisch op te nemen in uw JavaScript-code.

Initialisatiescript:

2. Voeg de JavaScript-bundel van Bootstrap toe:

```html

```

Dit script combineert zowel Popper als Bootstrap JS, nodig voor een goede tooltip-functionaliteit.

JavaScript-configuratie (optioneel):

U kunt het gedrag van de tooltip verder aanpassen met JavaScript. Bootstrap biedt de klasse `Tooltip` voor programmatische interactie met tooltips.

```javascript

var tooltipTriggerList =[].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))

var tooltipList =tooltipTriggerList.map(functie (tooltipTriggerEl) {

retourneer nieuwe bootstrap.Tooltip(tooltipTriggerEl)

})

```

Door alle elementen te doorlopen met het `data-bs-toggle="tooltip"` attribuut, initialiseert dit script individuele tooltips, wat meer controle geeft over het gedrag en de mogelijkheid om tooltips dynamisch te beheren, bijvoorbeeld bij het toevoegen van nieuwe knoppen aan de pagina.

Wanneer u nu over een element beweegt waarvoor een tooltip is gedefinieerd, ziet u de Bootstrap 5-tooltip met de geleverde inhoud verschijnen zonder extra CSS-klassen of stijl. Het positioneert zichzelf automatisch ten opzichte van het doelelement met behulp van de intelligente positioneringsengine van Bootstrap.