Materialize CSS adalah suatu framework untuk CSS layaknya Bootstrap. Sebagai framework yang cukup popular dikalangan developer, Materialize ini menawarkan fitur-fitur untuk menunjang kebutuhan yang sering digunakan dalam membangun tampilan website. Salah satu yang sering digunakan adalah membuat animasi slider untuk gambar. Ya kita akan belajar bagaimana cara membuat carousel dengan Materialize CSS.

Carousel adalah sebutan untuk slider gambar. Dengan adanya fitur ini kita tidak perlu repot membuat sendiri slider gambar. Karena sebuah yang kita butuhkan sudah disediakan oleh framework Materialize. Cara penggunaanya tidak terlalu susah. Yang terpenting adalah kalian harus sudah paham mengenai dasar HTML dan CSS saja. Untuk lebih jelasnya kalian bisa simak contoh code berikut ini.

Slider.html

Setelah sudah kalian bisa simpan file tersebut dengan format HTML. Untuk melihat hasilnya kalian bisa buka melalui browser kesayangan kalian. Jika berhasil maka tampilanya akan seperti ini.

Akan muncul kumpulan gambar yang disejajarkan secara horizontal. Namun gambar yang disorot adalah gambar yang dibagian tengah saja. Saat kalian klik atau geserkan gambar tersebut maka gambarnya akan berganti layaknya kalian bisa pilih pilih gambarnya.

Dengan adanya carousel ini, akan membuat tampilan website kita menjadi lebih menarik dan juga tidak akan memakan banyak tempat karena gambar akan disatukan dengan sistem slider. Mudah bukan ?

Sekian pembahasan mengenai bagaimana cara membuat carousel dengan Materialize CSS. Semoga artikel kali ini bermanfaat dan dapat menginspirasi kalian semua. Sampai jumpa pada pembahasan artikel lainya yang tak kalah seru dan menarik. Belajar dengan cara yang menyenangkan hanya di Dumet School.