0

Cara Membuat CSS Putar Di Header

Rabu, 20 Februari 2013
Share this Article on :


Hey Yozers..
Apakah kalian pernah lihat CSS Puter di Header!!
Ya pasti kalian tahu donk..
Ya walaupun ada yang Sharingan puter kaya di blog saya..
Hiihihi..
Mau tau cara membuatnya??
Ayo langsung simak..

1. Masuk Dasbor -> Template -> Edit HTML
2. Centang "Expand Template Widget"
3. Cari "]]></b:skin>" ( Tekan Ctrl+F / F3 untuk mempermudah pencarian )
4. Jika sudah ketemu, copy code di bawah ini!!

.ACputer{margin-top:-170px; margin-left:820px; width:100px; height:100px;position:absolute; font-size:14px; text-align:center; text-shadow:0 1px 1px black} .AC1{background-color:rgba(0,0,0,0); border:25px solid black;  border-left:5px solid rgba(0,0,0,0); border-right:5px solid rgba(0,0,0,0); border-radius:1000px; width:90px; height:90px; margin:0 auto; position:relative; top:-70px; -moz-animation:spin2Pulse 1s infinite linear; -webkit-animation:spin2Pulse 1s infinite linear} @-moz-keyframes spin2Pulse {0%{-moz-transform:rotate(0deg);} 100%{-moz-transform:rotate(-360deg);} } @-webkit-keyframes spin2Pulse{0%{-webkit-transform:rotate(0deg);} 100%{-webkit-transform:rotate(-360deg);} }

NB :

  • Warna Merah adalah letak CSS Putar
  • Warna Orange adalah ukuran CSS Putar
  • Warna Hijau adalah arah berputarnya CSS Putar ( 360deg untuk berputar searah jarum jam,-360deg untuk berlawanan arah jarum jam )


5. Paste code di atas tepat di atas code  "]]></b:skin>"
6. Cari "<div id='header-wrapper'>" ( Tekan Ctrl+F / F3 untuk mempermudah pencarian )
7. Jika sudah ketemu, copas ode di bawah ini tepat di bawah code "<div id='header-wrapper'>"

<div class='ACputer'>
<div class='AC1'/>

8. Simpan
9. Selesai!

Nah bagaimana?
mudah kan?
Mungkin pada postingan selanutnya,saya akan share " Cara Membuat Sharingan berputar Di Header"
Sekian..
Thx..



Artikel Terkait:

0 komentar:

Posting Komentar