PANDA.BIRU: Tutorial : Buat Floating Button

Friday, March 16, 2012

Tutorial : Buat Floating Button

Okey, hari ni Ana nak ajar macam mana nak buat floating button. Apatu floating button? Cube intai blog Ana, kan ada dua button kat kiri, kan? Nak buat? Okey, jom tarik nafas. Bagus... Ni Ana bagi tiga button, tambahanya ialah twitter. Ni cara - caranya:

  1. Seperti biasa Dashboard > Design > Page Element > Add a Gadget > HTML / Javascript
  2. Copy code dibawah ni pula kat ruagan HTML / Javascript tu.
  3.  <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 FACEBOOK KORANG' 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 />

    <a class='linkopacity' href='LINK TWITTER KORANG' 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 />

    <a class='linkopacity' href='LINK  BLOG KORANG' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feed'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/blogger_64x64.png" /></a><br />


    </div>
     
  4. Yay, dah siap. Ehh belum lagilah. Ada lagi kerja.
  5. LINK FACEBOOK KORANG.:Untuk link facebook korang.
  6. LINK TWITTER KORANG: Untuk link twitter korang.
  7. LINK BLOG KORANG:Untuk link blog korang.
  8. Okey, dah siap. Jom intai blog korang.
                                                                            SELAMAT TINGGAL

No comments: