Efek Gambar Berputar ketika di Sentuh - Udah pernah liat gambar yang disentuh berputar2 ? memusingkan bukan .? yeah , sekarang kita yang bikin pusing user .. hehe gak usah banyak basa dan basi lagi yah ..
1. Edit Html , Cari Kode </head> , lalu letakan kode CSS dibawah ini tepat di atas kode </head> :
<style type="text/css">
div.guling-guling {width : 320px; margin : 10px auto; text-align:left;}
div.guling-guling a:hover img[alt*="Disc"] {-moz-transform : translate(40px,0) rotate(300deg);-o-transform : translate(40px,0) rotate(300deg);-webkit-transform : translate(40px,0) rotate(300deg);transform : translate(40px,0) rotate(300deg);}
div.guling-guling img[alt*="Disc"] {-moz-transition : all .5s ease-in-out;-o-transition : all .5s ease-in-out;-webkit-transition : all .5s ease-in-out;transition : all .5s ease-in-out;}
.credit{width : 460px; font-size:12px;text-align:center;display:block;padding:10px;margin:1em auto;color:#7c725f;word-wrap:break-word;background-repeat:repeat-x;background-image:-khtml-gradient(linear, left top, left bottom, from(#1a1a19), to(#1f1f1e));background-image:-moz-linear-gradient(#1a1a19, #1f1f1e);background-image:-ms-linear-gradient(#1a1a19, #1f1f1e);background-image:linear-gradient(#1a1a19, #1f1f1e);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #1a1a19), color-stop(100%, #1f1f1e));background-image:-webkit-linear-gradient(#1a1a19, #1f1f1e);background-image:-o-linear-gradient(#1a1a19, #1f1f1e);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1a1a19', endColorstr='#1f1f1e', GradientType=0);-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#1a1a19', endColorstr='#1f1f1e', GradientType=0)";background-image:linear-gradient(#1a1a19, #1f1f1e);-webkit-box-shadow:inset 0 0 1px rgba(0, 0, 0, 0.5),0 1px 0 rgba(255, 255, 255, 0.05),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0;-moz-box-shadow:inset 0 0 1px rgba(0, 0, 0, 0.5),0 1px 0 rgba(255, 255, 255, 0.05),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0;box-shadow:inset 0 0 1px rgba(0, 0, 0, 0.5),0 1px 0 rgba(255, 255, 255, 0.05),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0;-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;border-radius:5px;}
</style>
2. Cara Memanggil Kode tersebut lihat di bawah ini :
<div class="guling-guling">3. Ganti Text ( Alamat-Gambar.jpg ) dengan Alamat Gambar yang akan sobat putar ketika di sentuh ..
<a href="#"><img src="Alamat-Gambar.jpg" width="150" alt="Disc"/></a>
</div>
Terima Kasih telah membaca artikel tentang Cara Membuat Efek Gambar Berputar ketika di Sentuh . Silahkan baca artikel lainnya di daftar isi.
Judul :
Cara Membuat Efek Gambar Berputar ketika di Sentuh
.
Ditulis oleh :
Unknown
.
Pada hari :
Tuesday, 12 August 2014
.
Rating Blog :
5
dari 5
Related Post
Cara Menulis Konten Yang Baik
Konten adalah salah satu modal untuk mendapatkan pengunjung. Namun tak sembarang konten bisa
Cara Menaikan Posisi Artikel di SERP Tutorial Bangsat - Blog Tutorial Bangsat akan membahas tentang Cara Meningkatk
Cara membuat efek bayangan di Template blog
Cara membuat efek bayangan di Template blog. Pada kesempatan saat ini Tutorial Bangsat 
Tips Sederhana Mempercepat Loading Blog
Tips Sederhana Mempercepat Loading Blog, juga untuk meningkatkan SEO ini, selalu Tutorial Bangsa
Syarat berkomentar :
1. Tidak boleh mencantumkan link aktif ( auto delete )
2. Tidak boleh mengandung SARA, pornografi,dsb.
3. Budayakan berkomentar dengan sopan dan menghargai pendapat orang lain.
ConversionConversion EmoticonEmoticon