CSS Gambar Berputar Otomatis Ketika Disentuh Mouse

Berikut cara mudah membuat gambar/ foto dapat berputar kekanan/ searah jarum jam saat disentuh mouse.

Bahan-bahan :

  1. CSS
  2. Div Class
  3. Javascript (tak perlu)

Langkah-langkah :

  1. Copy CSS berikut
    <style type="text/css"> .gambarKangsigit { float: left; overflow: hidden; position: relative; -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; transition-property: transform; overflow:hidden; } .gambarKangsigit:hover { -webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); -o-transform:rotate(360deg); }</style>
  1. Copy Div Berikut
  2. <div class="gambarKangsigit"> <img src="http://2.bp.blogspot.com/-t1RYh2yhh-U/VD6n8SOuXkI/AAAAAAAAA8k/gzQGttOH7JM/s1600/LOGO-britha.PNG"/> </div>
Sebagai contoh, sorot gambar dibawah ini..



URL

Komentar yang bermanfaat mendapat Rating*****oleh Admin blog ini