W3.CSSLesson 48Preview gratis
W3.CSS Slideshow
Lesson ini bagian dari W3.CSS · Semua level
Ringkasan
Slideshow menampilkan sekumpulan gambar atau teks secara bergantian dalam satu bingkai. Kuncinya adalah .w3-display-container sebagai wadah posisi absolut, lalu tiap slide disimpan sebagai gambar yang tampil maupun disembunyikan lewat JavaScript. Tombol panah diletakkan dengan .w3-display-left dan .w3-display-right.
Poin kunci
- Bungkus slide dalam .w3-display-container agar anaknya bisa diposisikan bebas
- Slide aktif ditampilkan, slide lain disembunyikan dengan display: none
- Tombol panah memakai .w3-display-left dan .w3-display-right
- Caption ditengahkan dengan .w3-display-middle
- Slide otomatis berjalan memakai setInterval pada JavaScript
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.