HTML-märkning
1. Skapa ett ``-element för att hålla scrollspy-navigeringslänkarna: ```html ... ``` 2. Lägg till ett `data-spy="scroll"`-attribut till ``-elementet för att aktivera scrollspy-funktionalitet. ```html ... ``` JavaScript 1. Inkludera jQuery och Bootstrap JavaScript-biblioteket. 2. Lägg till följande JavaScript-kod för att initiera scrollspy: ```javascript $(funktion () { $('body').scrollspy({ mål:'#scrollspy', offset:20 }); }); ``` - Alternativet 'mål' anger ID för navigeringselementet som innehåller scrollspy-länkarna. - Alternativet `Offset` ställer in avståndet i pixlar mellan toppen av webbläsarfönstret och punkten där scrollspy-navigeringen blir aktiv. Nu, när en sida rullas, uppdateras den aktiva länken i navigeringen automatiskt baserat på motsvarande avsnitt som är synligt i visningsporten. Kom ihåg att ersätta "..."-sektionerna i HTML-uppmärkningen med ditt eget innehåll och navigeringslänkar.
```html
...
```
2. Lägg till ett `data-spy="scroll"`-attribut till `
JavaScript
1. Inkludera jQuery och Bootstrap JavaScript-biblioteket.
2. Lägg till följande JavaScript-kod för att initiera scrollspy:
```javascript
$(funktion () {
$('body').scrollspy({
mål:'#scrollspy',
offset:20
});
- Alternativet 'mål' anger ID för navigeringselementet som innehåller scrollspy-länkarna.
- Alternativet `Offset` ställer in avståndet i pixlar mellan toppen av webbläsarfönstret och punkten där scrollspy-navigeringen blir aktiv.
Nu, när en sida rullas, uppdateras den aktiva länken i navigeringen automatiskt baserat på motsvarande avsnitt som är synligt i visningsporten.
Kom ihåg att ersätta "..."-sektionerna i HTML-uppmärkningen med ditt eget innehåll och navigeringslänkar.
Tidigare: Hur skapar man Bootstrap 5 Popovers?
