Tutorial #7 Floating Facebook And Blogger Buttons and Others

Posted by: Eyfa Zalifa
Sebelum aku start tuto nie,aku nak korang tengok dulu apa dia floating button..

 Macam kat atas tu dalam blog aku..

Okey,are you ready?Ayai captain!
 Good:)

Sign in Blogger>Dashboard>Design>Add a Gadget>HTML/JAVASCRIPT

Copy code nie..

<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='http://www.facebook.com/fara.idola' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="http://2.bp.blogspot.com/-f1sKOT1c_h8/TVlbK4xSmHI/AAAAAAAAA4o/3rzgi6U3wY8/s1600/facebook1.png" /></a><br />

<a class='linkopacity' href='http://twitter.com/#!/fara_idola' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="http://4.bp.blogspot.com/-5LGPlA8BA1c/TVlbLhdXTKI/AAAAAAAAA4s/OfSrYe5BeRk/s1600/twett.png" /></a><br />

<a class='linkopacity' href='http://bicarafarah.blogspot.com/' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='go to dashboard'><img border="0" src="http://1.bp.blogspot.com/-o_3gU2EWC5U/TVlbMc7Y0-I/AAAAAAAAA4w/Bhg2IbZh7Ac/s1600/blogger_64x64.png" /></a><br />

</div>

Tulisan warna merah ialah link url korang ( contoh, Facebook, Twitter ), dan link biru link url gambar/icon.

Kalau nak tambah lagi button copy tanda ni je sebelum code </div>

left boleh tukar kepada right kalau suka.

  Okey setakat nie?Preview dan Save..


http://1.bp.blogspot.com/-tpmuYty_yCg/TVlX5OwSzZI/AAAAAAAAA4E/-jLUOu1jVsA/s1600/blogger-icon-big.png

 http://3.bp.blogspot.com/-uh3ocOkbMAw/TVlX5p7MFhI/AAAAAAAAA4I/B2i8PqfvgPU/s1600/Facebook-icon.png

http://2.bp.blogspot.com/-_9k-0vJXPdY/TVlX8Q5Jm6I/AAAAAAAAA4c/PJp04NF-9ZA/s1600/TwitterIcon.png

http://4.bp.blogspot.com/-sgwOM_XXZA0/TVlX9nUIgFI/AAAAAAAAA4k/F9H3I7-c8Dg/s1600/youtube-icon-PNG.png

 http://4.bp.blogspot.com/-V-Ww-pHyPl8/TVlX7ViavnI/AAAAAAAAA4U/XUxdhWcnrbo/s1600/Skype.png

 http://3.bp.blogspot.com/-vOjQl7fw9VE/TVlX6Q4jPbI/AAAAAAAAA4M/uGWKG4nGisQ/s1600/Icon-Gmail.png

http://4.bp.blogspot.com/-rMkd6_kRc4M/TVlX81R2tsI/AAAAAAAAA4g/9BwGQsKnXio/s1600/yahoo_icon.png

http://1.bp.blogspot.com/-zi7st4AFR8A/TVlX7x8ElRI/AAAAAAAAA4Y/n-NS3_N6HWc/s1600/Tumblr.png

 http://2.bp.blogspot.com/-VH2sdFilWdA/TVlX6z6Z_kI/AAAAAAAAA4Q/PuoA-RSc9wU/s1600/myspace-icon.png
http://4.bp.blogspot.com/-ZpfG33C9Gtg/TVnrCiXDO-I/AAAAAAAAA40/TAI0X5eoHOY/s1600/formspring.png


2 doakan Eyfa Zalifa:

fawzeah zea on 11/6/11 4:12 PM said...

nk cuba blh hehehe..??

Miss Cupcake on 25/6/11 7:56 PM said...

@fawzeah zea

boleh cuba sayangg:)

Post a Comment

TERIMA KASIH KERANA KOMEN YA :)Really appreciate it..

Footprint sini:)

LinkWithin

Related Posts Plugin for WordPress, Blogger...
 

WHATEVER I THINK Copyright © 2010 Design by Ipietoon Blogger Template Graphic from Enakei