Memberi Dampak Memutar Pada Image Di Blog
Iseng-iseng sambil dengerin lagu Raisa - Terjebak Nostalgia, saya cari korban untuk mempraktekan efek transisi dengan rotasi. Akhirnya kelopak mata saya tertuju pada gambar yang ada di blog menyerupai gambar di postingan maupun sidebar dan widget.
Karena sebelumnya saya sudah berhasil menerapkan efek opacity pada image di postingan maupun di widget. Kini giliran efek rotasi yang menciptakan gambar berputar ketika disorot mouse. Mungkin ini tidak asing bagi sebagian blogger, tapi ini sesuatu hal yang gres bagi saya dengan membaca tutorial, praktek dan tidak takut gagal.
Sebelumnya saya sudah pernah memposting Belajar Dasar HTML, CSS, dan Javascript secara online, nah di sana-lah sedikit-sedikit saya mencar ilmu koding selama ini ditambah dari membaca postingan blogger-blogger lain.
Balik lagi ke topik masalah, kali ini efek berputar akan berfungsi pada semua gambar yang ada di widget, sidebar, dan postingan tanpa menciptakan kelas gres pada image. Caranya cukup mudah, bagi yang ingin mencobanya ikuti langkah-langkahnya di bawah ini.
Cari aba-aba yang menyerupai ini a img, bila belum ada silahkan dibentuk saja dan simpan di bawah aba-aba body.
a img{border-width:0;transition:all 400ms ease-in-out}
a img:hover{opacity:.7;transform:rotate(360deg)} Kira-kira penyimpanannya akan tampak menyerupai ini:
body{............................................}
a:link{............................................}
a:visited{............................................}
a:hover{............................................}
a img{border-width:0;transition:all 400ms ease-in-out}
a img:hover{opacity:.7;transform:rotate(360deg)} Kemudian cari aba-aba yang menyerupai ini .post img, bila belum ada silahkan dibentuk saja dan simpan di bawah kelompok aba-aba .post
.post img{transition:all 400ms ease-in-out}
.post img:hover{opacity:.7;transform:rotate(360deg)} Kemudian save template blog Anda dan coba sorotkan mouse pada gambar di blog Anda. Hehehe...sekarang gambar di blog Anda berputar 360 derajat.
Kaprikornus pada dasarnya bila kita niat mencar ilmu khusunya mencar ilmu aba-aba HTML atau CSS untuk membentuk atau menciptakan blog dan tidak hanya sekedar blogging, jangan takut untuk mencoba dan mencoba. Kesalahan yang mungkin kita buat akan menunjukkan pelajaran yang sangat berharga. Kita akan mendapat pujian tersendiri sehabis apa yang kita coba dan berhasil. Kaprikornus acara blogging kita tidak sia-sia.
Sumber https://www.kompiajaib.com/
0 Response to "Memberi Dampak Memutar Pada Image Di Blog"
Posting Komentar