♥ Love Story.

Nur Farisya Safiyya

.The Girl.

It Me

• Story • owner • links • Stuff •
Dashboard +Follow

Pencuri Hati

Follow @faraheone

.Gula Hati.

Cinta Hati

Hanya Aku Cinta Kau Seorang..HACKS

♥ ----------------------

.Tagboard.

Talk To Me

URL blog wajib ade not email !

Harsh words & Anon not allowed !
Cuties Viewing | Visitors

Tutorial : Image Hover 5 (Berpusing)

posted on Tuesday, January 15, 2013 | 12:33 PM | 0 Teddy Bear

1. Dashboard > Template

2. Press Ctrl + f serentak dan cari code </style>

3. Kemudian, copy code dekat bawah ni

#card {

-webkit-transform-style: preserve-3d;

-webkit-perspective: 1000;

width: 100px;

height: 100px;

position: relative;

margin:0px;

}

.back, .front {

position: absolute;

-webkit-backface-visibility: hidden;

-webkit-transition: -webkit-transform 0.4s ease-in;

width: 100%;

height: 100%;

font-family:verdana;

color: #000;

font-size:8px;

}

.back {

-webkit-transform: rotateY(180deg);

background: #000000;

overflow: hidden;

}

.front {

}

#card-container {

display: inline-block;

text-align: justify;

}

#card-container:hover .back {

-webkit-transform: rotateY(0deg);

}

#card-container:hover .front {

-webkit-transform: rotateY(-180deg);

}

4. Paste di atas code tadi
5. Now, copy code ni pulak

<div id="card-container"><div id="card"><div class="back"><center>
<br/><br/><br/><br/>AYATKORG<br/></div>
<div class="front"><img src="URLIMG"></div></div></div>

6. Paste dekat bahagian yang korang nak. Contohnya dekat sidebar.
7. Preview & save

oren : warna background
hijau : ayat korang
pink : URL image/gambar

Older Post | Newer Post