Tutorial : Navigation With Hover

Monday, October 29, 2012

Assalamualaikum & Salam Sejahtera
Hari ni kebosanan memuncak lagi . so terasa nak kena update somthing . so benda paling mudah aku rase buat navigation dengan hover sekali . kali ni aku tambah effect rotate 360 degree . main pusing pusing lah dengan navi korang lepas ni . hehe . macam mana tuh ? jom tengok bawah ni .


Preview :


FacebookTwitterTumblrFormspringBlogskins



amacam . berminat tak kalo berminat , nah amek code die dekat bawah ni . paste dekat mana yang korang suka . semua jenis blog boleh guna . tak terhad untuk certain certain blog . kalau nak pakai tu , rajin rajin lah komen ye :)


<style>
.navies {
background:#666;
border:1px solid #a2a2a2;
color:#666;
display:inline-block;
width:80px;
padding:3px;
text-align:center;
letter-spacing:2px;
font-size:9px;
margin:3px;
-webkit-transform: rotate(360deg);
-webkit-transition:1200ms;
}
.navies:hover {
background:#a2a2a2;
color:white;
display:inline-block;
width:80px;
padding:3px;
text-align:center;
margin:3px;
-webkit-transform: rotate(-360deg);
-webkit-transition:1200ms;
}
</style>
<a class="navies" href="LINK">Facebook</a><a class="navies" href="LINK">Twitter</a><a class="navies" href="LINK">Tumblr</a><a class="navies" href="LINK">Formspring</a><a class="navies" href="LINK">Blogskins</a>
mana mana code yang korang rase nak ubah tu , sila ubah mengikut kreativiti korang ye . kbai o/

13 comments:

© 2017 HAFIZ ZULKAFLY ALL RIGHTS RESERVED