Cara Membuat Gambar Header Bergeser Saat di Sorot Cursor



Tahap:
1. Login blogger Kalian.
2. Trus Masuk Ke Template.
3. jangan Lupa beri centang pada Expand Template Widget
Cari kode ]]></b:skin>, Pastekan Kode Di Bawah Ini Tepat Di atas Kode Tadi.
div.SCheader {
-moz-transition: all 0.75s ease-in-out 0s;
background: url("http://www.deviantart.com/download/209975142/luffy_render_by_namibekkklein-d3h0huu.png") no-repeat;
margin: 0px;
position: absolute;
}
div.SCheader {
-moz-transition: all 0.5s ease 0s;
-webkit-transition: all 900ms ease-out;-moz-transition: all 900ms ease-out;-ms-transition: all 900ms ease-out;-o-transition: all 900ms ease-out;transition: all 900ms ease-out;
background: url("http://www.deviantart.com/download/209975142/luffy_render_by_namibekkklein-d3h0huu.png") no-repeat;
margin-left: 300px;
margin-top: 0px;
position: absolute;
height: 500px;
width: 970px;
}
div.SCheader :hover {
-webkit-transition: all 900ms ease-out;-moz-transition: all 900ms ease-out;-ms-transition: all 900ms ease-out;-o-transition: all 900ms ease-out;transition: all 900ms ease-out;
background: url("http://www.deviantart.com/download/209975142/luffy_render_by_namibekkklein-d3h0huu.png") no-repeat;
}
#header-wrapper:hover .SCheader {
margin-left: 400px;
}

Keterangan :
Orange : URL gambar Kamu.
Hijau : Nama Kepala Headermu.
Kuning : Posisi Awal Gambar
Ungu : Ukuran Gambar Kamu
Pink : Posisi Akhir Gambar

"SELANJUTNYA ATUR SENDIRI :P"

4.oke sekarang kita aktifkan cssnya,Sekarang Cari kode

<div id='header-wrapper'>


5. Pastekan Kode Di bawah ini Di Bawah kode Di atas

<div class='SCheader'/>

6. Klik PRATINJAU, untuk melihat jadi apa nggak, Kalau jadi Klik Save.

Sumber ~ Didil Cyber

SHARE THIS
Previous Post
Next Post
January 10, 2013 at 9:28 AM

bang , ini gambar header emang punya sendiri ato dapet dari gw ? ni juga Blockquote nya ngikut segala . .
jgn ngikutin please , creative dikit knp ? -_-

Zhaa-inc.blogspot.com <<

Reply
avatar
January 11, 2013 at 1:43 AM

ini post copas, liat Credit nya
gambar heade nya dari sana nya lah -_- Blackquote dari sana juga -_-
nyalahin ane mulu

Reply
avatar
January 11, 2013 at 1:47 AM

ini Code gambar ane tuh : http://i.imgur.com/Zrh6B.png

Reply
avatar
January 12, 2013 at 12:39 AM

blog walking :D

http://arieagustomi.blogspot.com/

Reply
avatar