Senin, 11 Oktober 2010

Membuat button menu animasi

Apa anda merasa bosan dengan menu bawaan multiply, script css ini membuat button menu dengan animasi seperti terlihat gambar disamping dan berjalan untuk semua custome a theme apa saja. Apabila didalam script anda mengandung syntax² pada script dibawah ini, lebih baik kamu taruhlah script bagian ini paling atas sendiri, seandainya tidak berjalan seperti yg diinginkan maka kamu perlu menghapus script lamamu yg mengandung syntax tulisan sama seperti script dibawah ini supaya menghasilkan seperti gambar disamping. Masukkan script dibawah ini ke http://multiply.com/setup/pages/upload-css 

/* BUTTON DENGAN ANIMASI */
a.topt, a:link.topt, a:visited.topt, div#subnav li.gnopt {
display: block;
background: url(http://www.geocities.com/chonk_andrew3/button/a113.gif) no-repeat;
width : 80px;
float: left;
height: 22px;
text-align: center;
font-size: 11px;
font-color : #fff;
color: #fff;
padding: 1px 1px 1px 1px;
line-height: 19px;
font-weight: bold;
border : none;
margin : 0;
}
a.toptsel, a:visited.toptsel, a:link.toptsel, div#subnav li.gnoptsel, a:hover.toptsel, a:link:hover.toptsel, a:visited:hover.toptsel {
display: block;
background: url(http://www.geocities.com/chonk_andrew3/button/a116.gif) no-repeat;
width : 80px;
float: left;
height: 22px;
text-align: center;
font-size: 11px;
color: #000;
padding: 1px 1px 1px 1px;
border : none;
text-decoration: none;
line-height: 19px;
font-weight: bold;
margin : 0;
}
a.topt:hover, div#subnav li.gnopt:hover, a:hover.topt, a:link:hover.topt, a:visited:hover.topt {
display: block;
background: url(http://www.geocities.com/chonk_andrew3/button/a116.gif) no-repeat;
width : 80px;
float: left;
height: 22px;
text-align: center;
font-size: 11px;
color: #000;
padding: 1px 1px 1px 1px;
text-decoration: none;
line-height: 19px;
font-weight: bold;
border : none;
margin : 0;
}

Macam2 button ada dibawah sendiri, button menu anda bisa merubahnya sendiri dan menyesuaikan dengan template anda hanya merubah link background pada script diatas yaitu : http://www.geocities.com/chonk_andrew3/button/a116.gifdan  http://www.geocities.com/chonk_andrew3/button/a113.gif. Saya sarankan menu link background jangan disamakan semua supaya menghasilkan animasi.... 

PERHATIAN
Check scriptmu jangan sampai ada script seperti tulisan dibawah ini kecuali kamu ingin merubah tulisan home, blog, music, dll pada menu diatas dan mengikuti langkah2 tip dan trick selanjutnya pada
http://linux3r.multiply.com/journal/item/13

/* MENGHILANGKAN MENU HOME, MUSIC, BLOG dst */
div#subnav {
display:none;
}


MACAM ² BUTTON MENU





Digg Google Bookmarks reddit Mixx StumbleUpon Technorati Yahoo! Buzz DesignFloat Delicious BlinkList Furl

0 komentar: on "Membuat button menu animasi"

Posting Komentar

Buat siapa saja yang suka dengan artikel saya, silahkan anda share di mana saja anda suka (blog, facebook, twitter dll). Namun, bila berkenan mohon cantumkan link sumber dari artikel yang sobat blogger share (copy/paste). Mari bangun Indonesia lebih baik lagi, dengan berbagi informasi yang bermanfaat. Terima kasih,,^o^
======================================================

Next Prev home