#Tip$ & Tutorial .. Hot Icon...

Hye..!! Fuh..!! finally, publish pn, ef ade exam, dlm mse yg sme, teringat2 nk publish tutorial nie..

Kali nie.., arief/ef nak sharing tutorial ' Lil' Icon' yg maybe x de org buat lagi kot... Kalau dh ade org buat pon, tak pe la, tapi mane la tau, ade somebody yg baru berblog nie, teringin nak try this on their own blog...
Urmm.. tutorial ini mugkin agak menarik (laen org, laen pendapatnye) pernah tak korang terpikir nak tukar Icon [Follow] [Dashboard] at the top of ur page tu..

Check It Out...

*Click on '#Beat' to watch the preview of icon...
*Top Icon Without Changing Icon
#BEAT

<div style="position: fixed; top: 5px; right: 84px;"><a class="linkopacity" href="URL" target="_blank" rel="nofollow" title="TITLE"imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ICON" /></a><br />

<div style="display:scroll; position:fixed; top:5px; right:2px;"><a class="linkopacity" href="URL"target="_blank" rel="nofollow" title="TITLE" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ICON" /></a><br />

<div style="display:scroll; position:fixed; top:5px; right:166px;"><a class="linkopacity" href="URL" target="_blank" rel="nofollow" title="TITLE"imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="ICON" /></a><br />

</div></div>

*Side Icon Without Changing Icon
#BEAT

<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:140px; left:-12px;'>

<a class='linkopacity' href='URL' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='TITLE'><img border="0" src="ICON" /></a><br />

<a class='linkopacity' href='URL' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='TITLE'><img border="0" src="ICON" /></a><br />

<a class='linkopacity' href='URL' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='TITLE '><img border="0" src="ICON" /></a><br />

</div>

#Check It Out..!

*Top Icon With Changing Icon
#BEAT

<div style="position: fixed; top: 5px; right: 84px;"><a class="linkopacity" href="URL" target="_blank" rel="nofollow" title="TITLE" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" onmouseout="this.src='ICON 1'" onmouseover="this.src='ICON 2'" src="ICON 1" /></a><br />

<div style="display:scroll; position:fixed; top:5px; right:2px;"><a class="linkopacity" href="URL" target="_blank" rel="nofollow" title="TITLE" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" onmouseout="this.src='ICON 1'" onmouseover="this.src='ICON 2'" src="ICON 1" /></a><br />

<div style="display:scroll; position:fixed; top:5px; right:166px;"><a class="linkopacity" href="URL" target="_blank" rel="nofollow" title="TITLE" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" onmouseout="this.src='ICON 1'" onmouseover="this.src='ICON 2'" src="ICON 1" /></a><br />

</div></div>

*Side Icon With Changing Icon
#BEAT

tyle 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:140px; left:-12px;'>

<a class='linkopacity' href='URL' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='TITLE'><img border="0" onmouseout="this.src='ICON 1'" onmouseover="this.src='ICON 2'" src="ICON 1" /></a><br />

<a class='linkopacity' href='URL' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='TITLE'><img border="0" onmouseout="this.src='ICON 1'" onmouseover="this.src='ICON 2'" src="ICON 1" /></a><br />

<a class='linkopacity' href='URL' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='TITLE '><img border="0" onmouseout="this.src='ICON 1'" onmouseover="this.src='ICON 2'" src="ICON 1" /></a><br />

</div>