dynamic driveWalau sebenarnya jika ditelaah pernah memosting juga mengenai tutorial efek gambar CSS 3D Flip dan Before and After Image (transition trick) Efek akan terlihat jika cursor didekatkan pada objek tujuan (hover)
CSS 3D Flip
Salah satu fitur terobosan di CSS3 adalah kemampuan untuk memutar elemen HTML dalam ruang 3D. Di bawah kode CSS menunjukkan bagaimana untuk memutar "2 sisi" elemen baik pada X atau sumbu Y untuk mengungkapkan isi di sisi belakang. Hanya memindahkan mouse anda ke atas elemen untuk melihat flip. Kode bekerja di FF10 +, IE10 +, Chrome, dan Safari, dengan browser yang mendukung bukan sekedar menampilkan konten sisi belakang itu dari awal.
DEMO
Wanita cantik kalau rame-rame gitu malah pusing milihnya,jadi kepengen cemuanyah gitooh!!!
You can get code and read tutorial here CSS 3D Flip
Before and After Image (Peel Back)
"Before and After" gambar selalu menyenangkan untuk dilihat, terutama jika transisi yang tepat digunakan secara efektif swap antara keduanya. Contoh CSS menunjukkan menggunakan CSS3 animasi untuk menghidupkan "clip" property of "before" untuk mengupas dan mengungkapkan "after" onmouseover gambar. Hasilnya adalah sederhana namun ramping "Before and After" efek gambar!
DEMO
You can read full documentation here Before and After (Peel Back) Image
Untuk bonusnya Koben kasih tools untuk membuat markup HTML buat iframe karya master @nitinmaheta iFrame Generator. Master satu itu rajin bener bikin tools buat kita ;)) :x :P
Happy coding \m/
Untuk bonusnya Koben kasih tools untuk membuat markup HTML buat iframe karya master @nitinmaheta iFrame Generator. Master satu itu rajin bener bikin tools buat kita ;)) :x :P
Happy coding \m/
Tidak ada komentar:
Posting Komentar