Cara Membuat Slide Melayang Di Bawah Kiri

____________________________________________________________


  1.  Login Ke Akun Blogger Sobat
  2. Pada Dasbor Pilih Rancangan/Design Kemudian Pilih Tambah Gadget/Add Gadget Dan Pilih Yg HTML/JAVASCRIPT
  3. Copas Kode Berikut Didalamnya 
  4. <style>#facebook-teja,#twitter-teja,#salingsapa-teja,#plurk-teja{text-align:center;-o-transition: all 0.4s ease-in;-moz-transition: all 0.4s ease-in;-webkit-transition: all 0.4s ease-in;z-index: 1000;font-family:arial;width:150px;position: fixed;left:0;margin-left:-120px;border:1px solid #ffffff;background-position:top right no-repeat;padding:5px;font:15px Arial;color:#eee;border-top-right-radius:8px;border-bottom-right-radius:8px;-moz-border-radius-topright:8px;-moz-border-radius-bottomright:8px;-webkit-border-top-right-radius:8px;-webkit-border-bottom-right-radius:8px;}#facebook-teja {background:-moz-linear-gradient(top,#001C5A,#001551);background: -webkit-gradient(linear, left top, left bottom, from(#001C5A), to(#001551));top:350px;}#facebook-teja:hover,#twitter-teja:hover,#salingsapa-teja:hover,#plurk-teja:hover{width:150px;opacity:1.0;margin-left:0;cursor:hand}#facebook-teja a:hover,#facebook-teja a:visited,#twitter-teja a:hover,#twitter-teja a:visited,#salingsapa-teja a:hover,#salingsapa-teja a:visited,#plurk-teja a:visited,#plurk-teja a:hover{text-shadow:none;color:#ffffff}#twitter-teja {background:-moz-linear-gradient(top,#67C9E9,#029BC5);background: -webkit-gradient(linear, left top, left bottom, from(#67C9E9), to(#029BC5));top:382px;}#salingsapa-teja{background: #51A104 -moz-linear-gradient(top,#51A104,#000);background: -webkit-gradient(linear, left top, left bottom, from(#51A104), to(#000));top:414px;}#plurk-teja,#changetejahtc ul li{background: -moz-linear-gradient(top,  #AF0000,  #6B0000);background: -webkit-gradient(linear, left top, left bottom, from(#AF0000), to(#6B0000));}#plurk-teja {top:446px;}</style>
    <div id='plurk-teja'><a href='http://www.plurk.com/TEJA81'target='_blank'>Plurk</a></div>
    <div id='salingsapa-teja'><a href='http://www.salingsapa.com/index.php?p=u/muhammadsuteja'target='_blank'>Salingsapa</a></div>
    <div id='facebook-teja'><a href='http://id-id.facebook.com/tejahtc'target='_blank'>Facebook</a></div>
    <div id='twitter-teja'><a href='http://twitter.com/#!/muhammadsuteja'target='_blank'>twitter</a></div>
     4 . Simpan Dan Lihat Hasilnya

    Perhatian : Jika Menu Slide Tidak Meuncul Sobat Bisa menaruh KOdenya Dibawah Kode <body>

    CATATAN : Ubah KOde Yg Berwarna Orange  Dengan Url/Link Sobat inginkan
                                   Dan Ubah Yg Berwarna Hjau Dengan Judul Yg sobat inginkan
                                  Bila Sobat Mengerti Css Sobat Bisa mengotak-atik cssnya sesuai selera sobat
These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google
  • Furl
  • Reddit
  • Spurl
  • StumbleUpon
  • Technorati
Reaksi: 

Leave a comment


Desing Downloaded From Free Blogger Templates | Free Website Templates | Free PSD Graphics
Related Posts Plugin for WordPress, Blogger...