20 September 2011

tutorial- floating social website icon (facebook, twitter, blogger)


Biase tengak icon fb, tw, blog terapung kat tepi blog ? okay, cara dia.

1.design-page element-add a gadget-HTML javaskript

<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=' LINK FB ' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="URL IMAGE" /></a><br />
<a class='linkopacity' href=' LINK TW' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feed'><img border="0" src="URL IMAGE" /></a><br />
<a class='linkopacity' href=' LINK BLOG' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feed'><img border="0" src="URL IMAGE" /></a><br />
</div>

red: semakin kecik nombor tu, semakin atas icon korang.
purple: boleh pilih left or right
orange: link korang sendri
yellow: boleh letak URL image korang sendri. atau ambek kat sini


coding credit: Dania
icon:Azhafizah



You may leave your comment :)

3 comments: