Tutor 14-->Membuat Floating Button

Assalamualaikum.

Rasa sayang lah nak tinggalkan buat tutorial ni..
Walaupun mataku sudah berpinar-pinar @_@..

Di malam hari yang hening ni aku nak ajar cara-cara nak buat floating button. Apakah fungsi floating button ni? Okeh, benda ni memudahkan reader connect dengan korang. Contoh kalau click button Facebook terus boleh tengok facebook profile korang dan sebagainya. Lagipun cara ini dapat ringankan blog korang. Korang dapat kurang berat blog korang. Contoh, kalau korang letak facebook badge, twitter badge atau sekawan dengannya memang memberatkan blog untuk loading tapi kalau korang guna floating button untuk connect dengan reader korang dapat kurangkan ber"kb-kb" berat badan ooppps berat blog korang.
Tampa berlenggah-lenggah lagi mohh aku ajorkan cara nak buat benda alah ni..karang aku merepek sampai berkilo-kilo karang korang juga yang susahkan..
Kalau sesiapa yang masih blur..meh tengok gambar ni..kasi faham sikit.

cantik dan kemas kn..??

Faham tak wahai kawan-kawan? Kalau tersuka jom ikuti langkah-langkah yang penuh dramatik ini :

1. Sign in blogger > > Design > Add Gadget > Html/Java Script
2. Copy coding di bawah dan paste ke dalam Html/Java Script

<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/anismdnor' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRledPyLMzH-GTBU7Z3Wy_2qLUN9OCTz4iAhzgXMAlf3Tg0JW8i_P5IklN4DX8X11F0NtvpSzlAHl33ZLPTzbkLC_gwDBnVi8ssU0L-trpMHu1p_DfrPvji_Nh-aoboBJWD7CJX2EAAgM/s1600/facebook1.png" /></a><br />
<a class='linkopacity' href='http://twitter.com/#!/nami_farina' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLAQwOdDRiCa6R6sjIDZSF09azCihiCgiKiD7EHDgT4VhrZm68Sm7-TD5VKY_pdOCEu6YZGm_uMZWcEdIHJxu5InRcFVzcGdB2Q2b4FkRuxxM5scC8xJWgIVSITINm2NtoFiC1dURwrRo/s1600/twett.png" /></a><br />
<a class='linkopacity' href='http://sayasukamenulisdanberleter.blogspot.com/' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='go to dashboard'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLiDE80oAHgQYfc_Muq1W16Y6Yzme0os8QLbRxTNJXnZwiSsHaWkKHhQsqNCmAYjx0vkBC3zV25SrhaWa3Ip4UFXCA7FoZ-KWFSUv51VOYSXquF8xsevnZ6MXspiEkTTXcM_ZCx_Gcm14/s1600/blogger_64x64.png" /></a><br />
</div>

3. 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.
# Ubah font warna hijau sekali 
4. Faham tak? dan SAVE je

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgu3fh17_yRi-fhzmE6SOKGTM37npxMc5wtO9f4cm5oOp0l6vy4xW2y0ZEKiSD6_k8O5USrNE9N6EvggdneiltWsWI1HQkBJnN56MIOwKdZv8eBzk_iKyYJ13NN_2Y-BEa__qiGj88BF9A/s1600/blogger-icon-big.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPZbaqwrSjhQGCsAdf5O72Dy7T5IEGhzCsoNTiofxFZh2uR2Swp262OXIRIf4xtZRXkjrK3VsUjDtlkq7qHfr8X51U52Z7-U32MOrJBHx29qYZZWowzpfJ1wuaoXWIqKoKngIpRlxysDA/s1600/Facebook-icon.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfyVCdYLAH87epqGFG5k2Z9IRQvEMazlrhyHFI7FNjO8-Vk_wwxHyYIPMau83UrzphZLKQtDhQBf_9k7pr1oFoywH8Zx2lTcyzAYizQpAbJteipDm0xOfhX2NepJn2XsvtMG1wSKuF_7c/s1600/TwitterIcon.png

Nak yang lain??carik sendiri.. !..hhihih..
Suke tak??komen tau..

Credit By <a href="http://bicarafarah.blogspot.com/p/blog-tutorial_1005.html">Cik Nurfarah</a>

---

***SELAMAT MENCUBA***

---