Fajar Herianto

Cara Membuat Efek Gambar Membesar dan Memutar Di Blogger

Cara Membuat Efek Gambar Membesar dan Memutar - Bagi sobat yang ingin lebih mempercantik Tampilan Blog, soba bisa pakai Cara Membuat Efek Gambar Membesar dan Memutar jadi maksudnya saat Gambar disentuh oleh Kursor Mouse maka secara otomatis Gambar Tersebut akan Memutar dan Membesar.
Lihat Demonya dibawah ini.



Gimana sudah lihat coba arahkan Kursor Mouse ke Gambar diatas Memutar dan Membesar ya.
Bagi sobat yang ingin memasang nya di Blog sobat silahkan perhatikan baik-baik langkah-langkah dibawah ini.
  • Login ke Blog kamu.
  • Pilih EDIT HTML, cari kode </head>
  • Setelah ketemu letakan kode dibawah ini tepat diatas kode </head>
<style>#blazerblog{ -o-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-webkit-transition: all 0.8s ease;}#blazerblog:hover{ -o-transform: scale(1.5) rotate(720deg) translate(0px);
-moz-transform: scale(1.5) rotate(720deg) translate(0px);
-webkit-transform: scale(1.5) rotate(720deg) translate(0px);}#blog a:hover{transition: all 0.5s;-moz-transition: all 0.5s;}</style>
  • Simpan.
Nah untuk memberi Efek membesar dan memutar nya pada gambar silahkan perhatikan baik-baik kode dibawah ini, kamu hanya tinggal menambahkan kode <div id="blazerblog"> sebelum kode Script gambarnya dan </div> di bagian akahir nya .
Contoh.

<div id="blazerblog"> 
<a href="http://blazerracing.blogspot.com" target="_blank" title="Cara Membuat foto/gambar efek memutar-mutar dan membesar saat disorot mouse"><img height="203" src="http://3.bp.blogspot.com/-qO3L8iVxa4Q/TyjafAmQSkI/AAAAAAAAAVw/p0S58kjTSHk/s1600/f1ae1b772bfb390091307fea13295673dbb18b8a.png" style="border: 0px;" width="325" /></a></div>


Yang berwarna biru adalah URL Gambar nya.
Sepertinya cukup sekian penjelasan dari saya, jika sobat tidak paham atau kurang mengerti silahkan tinggalkan pesan di kotak

Posting Komentar

Fajar Herianto

{facebook#https://www.facebook.com/fajarcintalia} {twitter#https://twitter.com/HeriantoFajar} {google-plus#https://plus.google.com/u/0/118173459679605761698/posts} {youtube#https://www.youtube.com/user/aplikasiterunik} {instagram#https://www.instagram.com/aplikasiterunik/}

Formulir Kontak

Nama

Email *

Pesan *

Diberdayakan oleh Blogger.
Javascript DisablePlease Enable Javascript To See All Widget