Hay friends, Dengerin lagu yuks
Hehehehe ..
Andyrra

Male, 45 years

Batam, Indonesia

If you're doing your best, you won't have any time to worry about failure and The past can't see you, but the future is listening.

andyrra.com

Translate

Java Filipino Czech English iran Romania Thailand Bangladesh India India French German Spain Italian Dutch Russian Portuguese Japanese Korean Arabic Chinese Simplified

poto

Mounting created Bloggif

30 Mei 2013

Cara Membuat Gambar Berputar Dan Membesar Saat Disentuh Oleh Mouse


Cara Membuat Gambar Berputar Dan Membesar Saat Disentuh Oleh Mouse - Pengunjung Tutorial Belajar Blog Pada Kesempatan ini akan berbagi tutorial blog lanjutan dari apabila pada postingan sebelumnya gambar mempunyai efek zoom apabila mouse diarahkan pada gambar.
Kali ini saya sedikit berbagi tentang cara membuat gambar dalam posting blog berputar dan membesar saat di sentung oleh cursor, untuk contohnya coba sobat arahkan cursor ke gambar Naruto di atas, maka gambar akan berputar dan membesar. Apabila sobat blogger sekalian berminat untuk mencoba silakan ikuti langkah-langkah berikut ini:


1. Seperti biasa sobat harus login dulu di akun blog sobat
2. Pilih rancangan / desing dan klik edit HTML dan lanjutkan
3. Centang "Expand Template Widget" untuk menghindari apabila terjadi kesalahan
4. Sobat cari kode</head>
5. Setelah ketemu sobat copy paste code di bawah ini tepat di atas kode </head>

  <style>#oktri 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;}
#oktri img:hover{ -o-transform: scale(1.5) rotate(360deg); -moz-transform: scale(1.5) rotate(360deg); -webkit-transform: scale(1.5) rotate(360deg);}</style>



6. dan sobat klik save / simpan template.
Langkah selanjutnya untuk penenpatan gambar dalam postingan.
1. Sobat harus menambahkan kode  <div id="oktri">
</div> contoh seperti di bawah ini:


  
  <div id="oktri">
    &lt;a href="http://http://tutorialbelajarblogger.blogspot.com/"><img src="http://4.bp.blogspot.com/-CwEirHz3j3g/T3-qdL1Q4pI/AAAAAAAAAu0/yoWox29izCE/s200/naruto+dont+copy.png" /></a></div>






keterangan:
  1. kode berwarna biru adala kode pembuka dan penutup
  2. kode berwarna merah silakan sobat ganti dengan URL blog Sobat dan URL gambar yang ingin Sobat pasang di dalam postingan.
  3. Setelah semuanya selesai klik publikasikan. 
Demikianlah tips "Cara Membuat Gambar Berputar Dan Membesar Saat Disentuh Oleh Mouse".
Semoga bermanfaat Sobat.

Get free daily email updates!

Follow us!



Share to Facebook Share this post on twitter Bookmark Delicious Digg This Stumbleupon Reddit Yahoo Bookmark Furl-Diigo Google Bookmark Technorati Newsvine Tips Triks Blogger, Tutorial SEO, Info

0   komentar

Cancel Reply

Led


copas gif

loading

SOCIAL NETWORK

email  
   
 
google plusGoogle+
 
  youtube 
 
andyrra.com

VISITOR FROM

andyrra.com

RECENT POST



>

Enter your email address:



what is my ip address?