7Top Ranking
Jasa Review
Mainbitcoin

7 Cara Modifikasi Gambar Berputar Saat disentuh Kursor


Membuat Gambar berputar saat disentuh kursor tentunya akan memberikan sensasi tersendiri, selain itu mempelajari sistem modifikasi seperti ini merupakan tantangan khusus bagi saya jika diterapkan pada blog ini.

Melakukan desain ini merupakan salah satu cara untuk mempercantik tampilan artikel blog anda, hal ini juga bertujuan untuk menarik perhatian pengunjung, dengan begitu bisa jadi pengunjung blog anda betah dan akan mengingat ulang bahwa blog anda menjadi salah satu blog favorit mereka.

Jika biasanya gambar tampil secara standar, maka untuk mempercantik tampilan gambar yang standar (tidak bergerak) tersebut menjadi menarik, anda cukup mengikuti step by step cara yang saya jelaskan. (Arahkan Kursor pada gambar di bawah ini untuk melihat Demo secara langsung). Berikut Penjelasan: 7 Cara Modifikasi Gambar Berputar Saat disentuh Kursor versi 7Top Ranking.

Arahkan Kursor ke Gambar

Terwujud.com
1. Log In ke www.blogger.com
2. Buat atau edit artikel blog anda
3. Buka menu HTML bukan Compose
4. Copy dan Paste kode di bawah ini
<style>
#sundaboy img{-moz-transition:all .8s ease-in-out;-ms-transition:all .8s ease-in-out;-o-transition:all .8s ease-in-out;-webkit-transition:all .8s ease-in-out;transition:all .8s ease-in-out;} #sundaboy img:hover{ -o-transform: scale(1.5) rotate(360deg); -moz-transform: scale(1.5) rotate(360deg); -webkit-transform: scale(1.5) rotate(360deg);}
</style>
<div id="sundaboy">
<a href="http://www.terwujud.com/2014/01/antara-ovj-dan-yks.html" target="_blank"><img alt="Terwujud.com" src="http://2.bp.blogspot.com/-QYV0USE-Yaw/Us19g4MOZ1I/AAAAAAAACWA/GO3aRDVVvu0/s1600/OVJ+dan+YKS.jpg" height="200" title="Gimana gambarnya, berputar dan membesarkan!!!" width="184" /></a>
</div>
5. Publish atau Perbaharui
6. Klik Pratinjau untuk mengetahui hasil sementara
6. Lihat Hasilnya

Keterangan:
  • Tulisan scale(1.5) untuk memperbesar gambar. Silahkan ganti sesuai keinginan anda
  • Warna Merah dapat anda sesuaikan dengan keinginan anda, mulai dari link gambar, url gambar, title gambar serta tinggi-lebar gambar.
  • Tulisan rotate(360deg) merupakan kecepatan berputarnya gambar, anda bisa gandakan jumlahnya dari 360 menjadi 720 atau sesuai dengan kehendak masing-masing.

Demikian artikel tentang 7 Cara Modifikasi Gambar Berputar Saat disentuh Kursor, jangan lupa untuk membaca 7 Cara Membuka Password Memory Card yang Terkunci. Semoga Tutorial Desain ini bermanfaat untuk tampilan artikel anda. Terima Kasih!!.

Mau Artikel Gratis! Silahkan Tulis Email Anda.
Print PDF
Next
« Prev Post
Previous
Next Post »
Copyright © 2012. 7Top Ranking - All Rights Reserved | Template Created by Kompi Ajaib | Modified by Ibrahim Lubis