Hai Teman-teman semuanya, apa kabar? semoga tetap dalam keadaan sehat, kita lanjut lagi belajarnya, pada pembahasan kali ini kita akan membuat satu studi kasus yaitu membuat preloader memanfaatkan gambar gif dengan jquery.

Preloader adalah suatu efek animasi loading yang dapat kita buat menggunakan css,jquery dan lainnya, nah pembahasan kali ini kita akan membuatnya dengan menggunakan jquery, oke pertama silahakan teman-teman siapkan 1 buah gambar gif, jika sudah liahkan buat file html dan ketikan script berikut ini:

saya membuat sebuah container dan didalamnya saya membuat div class load yang saya berikan gambar gif yang saya sudah siapkan tadi, jika teman-teman save maka hasilnya akan seperti berikut ini:

membuat preloader memanfaatkan gambar gif dengan jquery1

Jika sudah silahakan teman-teman buat script jquery seperti berikut ini:

Sekarang jika teman-teman save maka hasilnya akan seperti berikut ini:

membuat preloader memanfaatkan gambar gif dengan jquery2

Hasilnya loading akan menarik karena kita menggunakan gambar gif, dan terlihat seperti loading sungguhan yang berjeda karna kita menggunakan method stop pada jquery.

Gimana teman-teman? cukup mudah bukan? untuk studi kasus kita kali ini tentang membuat preloader memanfaatkan gambar gif dengan jquery saya rasa cukup sampai disini dulu, semoga tutorial kali ini bermanfaat untuk teman-teman semuanya, sampai bertemu lagi pada tutorial berikutnya,

Terima kasih

WhatsApp chat