Bootstrap 5 TutorialLesson 29Preview gratis
BS5 Scrollspy
Lesson ini bagian dari Bootstrap · Semua level
Ringkasan
Scrollspy memantau posisi scroll halaman dan menandai tautan navigasi yang sesuai dengan bagian yang sedang terlihat, cocok untuk dokumentasi panjang. Caranya, tambahkan data-bs-spy="scroll" pada elemen scroll (biasanya body) dengan data-bs-target menunjuk navigasi, lalu tautan harus href menuju id bagian. Bootstrap akan menambahkan kelas .active secara otomatis.
Poin kunci
- Aktifkan dengan data-bs-spy="scroll" dan data-bs-target menunjuk navigasi.
- data-bs-offset mengatur jarak pandang saat menentukan bagian aktif.
- Tautan harus href menuju id bagian, misal #section1.
- Bootstrap otomatis menambahkan kelas .active pada tautan aktif.
- Berguna untuk dokumentasi, portofolio, dan landing page panjang.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.