Cara Membuat Efek Zoom Delay pada Gambar

Cara Membuat Efek Zoom Delay pada Gambar - Penggunaan ekef pada halaman website akan memberikan tampilan menjadi jauh lebih menarik. oleh karena itu hampir semua desain website saat ini didalamnya terdapat efek dan animasi agar ketika dilihat oleh pengguna tidak akan membuat bosan. Ada banyak cara dan banyak jenis efek yang bisa ditampilkan pada sebuah halaman website, misalnya saja efek bayangan, warna dan lain sebagainya.

Dikesempatan kali ini saya ingin berbagi tutorial sederhana tentang efek yang bisa kalian buat dengan HTML & CSS, yaitu tutorial Cara Membuat Efek Zoom Delay pada Gambar. Buat kalian yang ingin coba membuatnya bisa kalian ikuti langkah - langkahnya berikut ini.

Untuk membuat efek zoom delay pada gambar sangatlah mudah, yang pertama tentu kalian harus menyiapkan satu gambar sebagai objek dari efek yang akan dibuat nanti. Lalu kalian buat file index.html kemudian kalian ketikan sintak HTML untuk meload atau menampilkan gambarnya seperti berikut.

Pada tag img src silahkan kalian isikan gambarnya. Selanjutnya tambahkan style CSS untuk membuat efek zoom delay pada gambar. Silahkan kalian ketikan sintak CSS untuk membuat efek pada gambar seperti berikut.

Dari sintak diatas, efek pada zoom delay pada gambarnya kita manfaatkan properti transform dan untuk delaynya menggunakan properti transition. Silahkan simpan kembali filenya kemudian kalian buka pada browser dan lihat hasilnya.

Cukup sederhana dan mudah Cara Membuat Efek Zoom Delay pada Gambar, semoga bermanfaat selamat mencoba dan sampai jumpa diartikel selanjutnya.