Tuesday 22 July 2014

Blogskins List Hover vers 3

       Setelah share yang versi kedua, sekarang aku mau share versi ketiga. Yang versi ketiga ini sebenernya hampir sama dengan yang versi kedua, tapi versi ketiga ini akan berputar 360 derajat kalau dihover. Ini juga my own codes lho hihi, lagi belajar bikin kode sendiri nih. Preview :

  • Copy kode dibawah ini :
<style>
.bskins{
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
border-radius: 50%;
width: 100px;
height: 100px;
border: 5px solid #f1f1f1;
}
.bskins:hover{
-webkit-transform: rotate(360deg) ;
-moz-transform: rotate(360deg) ;
-o-transform: rotate(360deg) ;
-ms-transform: rotate(360deg) ;}
border-radius: 50%;
-webkit-transition: 1.0s;
    -moz-transition: 1.0s;
    border: 5px solid #dadada;
</style>
  • Pastekan dimanapun kamu mau, misalnya dilaman Skins.
  • Ubah kode yang berwarna merah dengan kode warna kesukaanmu. 
  • Kemudian, copy lagi kode dibawah ini :
<center>
<div><a href="Url blogskin" ><img class="skinny" src="Url screenshot blogskin" /></a>
<a href="Url blogskin" ><img class="skinny" src="Url screenshot blogskin" /></a>
<a href="Url blogskin" ><img class="skinny" src="Url screenshot blogskin" /></a>
<a href="Url blogskin" ><img class="skinny" src="Url screenshot blogskin" /></a></div></center>
  • Pastekan lagi kode tadi dibawah kode yang telah kamu paste distep pertama.
  • Ubah kode yang berwarna hijau dengan url blogskins kamu.
  • Ubah juga kode yang berwarna biru dengan url image screenshot blogskins kamu dan ukurannya harus 100 x 100 pixel.
  • Save and done!

1 comment:

 
Copyright © 2013-2017 By Anugerah Mullia Ulfa Salsabella. All Rights Reserved.