Tutorial : Floating Button

floating menu bar

Live Preview

1. Dashboard --> Layout --> Add a Gadget --> Html JavaScript
2. Sekarang copy code yang kat bawah nih
<style type='text/css'>
a.linkopacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;}
a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>
<div style='display:scroll; position:fixed; top:120px; left:-12px;'>
#apa2 saja..
<a class='linkopacity'
href='link korunk' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="images url" /></a><br />
#Facebook
<a class='linkopacity' href='http://facebook.com/username/' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/232.png" /></a><br />
#Twitter
<a class='linkopacity'
href='http://twitter.com/username/' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/432.png" /></a><br />
3. Tukar kat part yang di color kan dengan korunk punya nih :)

4. Lepas dah copy semua code icon ,jangan lupa letak code </div> kat pengakhiran code icon yang paling last tuh oke..

5. Preview.. tak ada papa masalah..

6. save !


4 comments

Terima kasih kerana sudi menulis komen di blog Nurrul, sebarang pertanyaan akan dibalas secepatnya. Jazakallahu khairan