MASIGNCLEAN101

Cara Menciptakan Gambar Berputar Dikala Disentuh Mouse

Cara Menciptakan Gambar Berputar Dikala Disentuh Mouse
Kamis, 09 Januari 2014
Trik Membuat Gambar Berputar Saat Disentuh Mouse dengan memakai CSS Hover Image ini memang paling sering dicari oleh sebagian banyak blogger yang ingin menciptakan blognya tampil lebih menarik.

Saya sendiri ingin sekali memakai trik hover image didalam blog ini, tapi sesudah aku coba berfikir lebih matang lagi, ternyata trik hover image ini tidak cocok dengan konsep yang sedang aku berdiri dalam blog ini.




Apakah kau punya pendapat yang sama dengan aku perihal Hover Image ini?

Karena Menurut saya, Hover Image atau gambar berputar sebelum diklik oleh mouse ini, tidak berperan penting dalam meningkatkan kualitas konten maupun Seo onpage.

Tapi jikalau kau ingin memakai trik ini, silahkan ikuti langkah-langkah dibawah ini.

  • Langkah Pertama, pastikan kau sudah login kedalam cpanel blog kau ya
  • Selanjutnya kau buka EDIT HTML pada cpanel blog kemudian cari aba-aba </head>
  • Setelah itu Salin CSS Hover Image dibawah ini dan letakkan sempurna diatas aba-aba </head> tadi.

<style type='text/css'> body img{   -webkit-transition: -webkit-transform 1.1s ease-in-out;   transition: transform 1.1s ease-in-out; } body img:hover{   -webkit-transform: rotate(360deg);   transform: rotate(360deg); } </style>

Kode di atas berfungsi untuk menciptakan Annimation Hover pada semua Gambar yang ada pada body, ibarat gambar didalam postingan, Popular Post, Recent Post dll

Sebagai contoh, kau sanggup lihat semua gambar dalam halaman ini termasuk pada header dan widget sidebar. Letakkan Mouse pada gambar dan kau akan eksklusif melihat secara eksklusif bahwa gambar pada postingan kali ini sudah disisipkan trik menciptakan gambar berputar ketika disentuh mouse.

Atau teman-teman sanggup coba tempatkan cursor mouse diatas logo Header Kang Wira.

Trik Membuat Gambar Berputar Saat Disentuh Mouse dengan memakai CSS Hover Image ini me Cara Membuat Gambar Berputar Saat Disentuh Mouse

Sekian dulu Tutorial perihal Cara Membuat Gambar Berputar Sebelum Disentuh Mouse.

Semoga Bisa dipraktekan pada blog kau yah. Apabila ada pertanyaan, jangan segan untuk berikan komentar pada sajian isi komentar dibawah ini.
Share This :

Related Post