Blog Request tutorial? klik disini!

  • Efek Hover Dengan CSS3 Transisi Dan Animasi Pada Gambar

    Ditulis oleh: Faizal Rafik
    5839 kali dibaca
    30 Mar / 2014 00:45

    Hallo teman-teman, dalam tutorial kali ini saya ingin berbagi ilmu sedikit tentang bagaimana cara membuat Efek Hover dengan CSS3 Transisi dan Animasi pada gambar, maksudnya adalah dimana saat cursor kita arah kan ke gambar maka akan muncul penjelasannya dari gambar tersebut. Nah untuk lebih memperjelas lagi apa maksud dari Efek Hover dengan CSS3 Transisi dan Animasi kita langsung praktek kan saja ya teman-teman.

    Silahkan lihat dulu demonya di sini

    Pertama buatlah stuktur HTML nya seperti di bawah ini :

    1. HTML

    Setelah membuat struktur HTML dan isinya sekarang masuk ke bagian CSS nya, tuliskan kode CSS nya seperti di bawah ini.

    2. CSS

    Nah jika HTML dan CSS nya sudah di tulis dengan benar silahkan di save lalu di preivew hasilnya di browser kalian masing-masing, mudah bukan. Selamat mencoba teman-teman sampai bertemu lagi di tutorial berikutnya.

    Untuk mendownload source nya bisa di download di sini Efek Hover dengan CSS3 Transisi dan Animasi






Baca juga

Rukan Artha Gading Niaga Blok i - 23, Jalan Boulevard Artha Gading

Kelapa Gading, Jakarta Utara 14240

(Belakang Mall Artha Gading)

Telp: (021) 4585-0387


Ruko Permata Regensi Blok B - 18, Jalan Haji Kelik

Srengseng, Kebon Jeruk, Jakarta Barat 11630

(Depan Hutan Kota Srengseng)

Telp: (021) 5890-8355


Ruko Jalan Taman Daan Mogot Raya No. 23

Kel. Tanjung Duren Utara Kec. Grogol Petamburan, Jakarta Barat 11470

(Belakang Mall Citraland dan Kampus UNTAR II)

Telp: (021) 2941-1188


Ruko Jalan Kartini Raya No. 53

Pancoran Mas, Depok 16436

(± 5 Menit dari Kantor Walikota Depok)

Telp: (021) 7720-7657


Rukan Crown Palace Blok A no 12, Jl Prof Dr Soepomo no 231 (Samping Universitas Sahid).

Kec. Tebet, Kel. Menteng Dalam.

(± 1 Menit dari Tugu Pancoran)

Jakarta Selatan 12870

Telp: (021) 2298-3886

Buka setiap hari Senin - Minggu jam 09.00 s/d 21.00

SMS: 0851-0055-5666 / 0819-7555-666 / 0812-9933-3913 / 0812-9393-3210 / 0812-1999-9155