Membuat Carousel Dengan Materialize
Halo teman – teman, selamat datang kembali di laman tips dan trik Source Code Aplikasi. Di artikel sebelumnya kita telah membahas sistem – sistem yang terdapat di framework materialize, dan di kesempatan kali ini kita masih membahas hingga dengan Membuat Carousel Dengan Materialize. Setiap framework css umunya telah menyediakan Carousel, namun banyak web design enggan menggunakannya. Mereka lebih memilih bagi menambahkan plugin sendiri bagi memperoleh user friendly, namun di framework satu ini yang telah menyediakan pun Carousel dengan hasil dapat dibilang user friendly. Jadi tanpa perlu lagi menggunakan plugin luar lagi, dan sebaiknya menggunakan plugin sesuai keperluan saja karena terlalu banyak plugin di laman pun akan berpengaruh loading nya ketika di buka karena memanggil library – library yang berbeda.
Karenanya dari itu kita mesti memajukan framework yang kita gunakan, agar plugin tambahan bagi kebutuhan yang lainnya. Carousel di framework ini pun tak kalah bagusnya, di artikel Membuat Carousel Dengan Materialize ini ada beberapa tampilan yang telah di sediakan
Dapat digunakan bagi product
Yang di atas ini bagi slider nya
Dan yang di atas ini dapat digunakan bagi slide text, bagi latihan kali ini kita akan membangun slider. Teman – teman siapkan text editornya dan file materialize nya lalu ketikkan script html nya seperti gambar ini bawah ini di file index.html nya
Dan masukkan image nya, teman – teman dapat menggunakan ukuran 700 x 350 px atau mungkin ukuran lainnya, seandainya telah tambahkan script jQuery nya bagi mengaktifkan Carousel nya
<script type=text/javascript>
$('.carousel.carousel-slider').carousel({fullWidth: true});
</script>
Save dan jalankan di browsernya, karenanya Carousel yang kita bikin berhasil dengan menggunakan materialize. Betul-betul simple dan gampang sekali tak perlu menggunakan plugin tambahan, hasilnya pun pun telah memiliki tampilan yang dinamis. Bagi script nya kita tambahkan class nya tampilan setiap device
Dengan demikian itu slider akan memiliki tampilan yang dinamis di setiap device
Bagaimana, lumayan gampang bukan..??
Saya rasa demikian dulu di artikel kali ini mengenai Membuat Carousel Dengan Materialize kita jumpa kembali di artikel berikutnya yang masih membahas framework materialize. Kurang lebihnya mohon maaf, semoga bermanfaat. Terimakasih dan hingga jumpa.
Sumber https://kursuswebsite.org
