Cara Membuat Menu Slide melayang di bagian kiri blog dengan css

Diposting oleh John Holongky Sinaga on Kamis, 31 Mei 2012
Hallo sobat sinaga ???
selamat sore ???
sore Ini saya aku posting tips blogger yaitu Cara Membuat Menu Slide melayang di bagian kiri blog dengan css , keren lho sobat sinaga
sobat sinaga sudah lihat itu SS nya, keren bukan ???
bagaimna ??? pengen buat nya ???
mari sya ajari !!!
cara ny juga seperti biasa !!!

  • Login Ke Akun Blogger Sobat
  • Pada Dasbor Pilih Rancangan/Design Kemudian Pilih Tambah Gadget/Add Gadget Dan Pilih Yg HTML/JAVASCRIPT
  • Copas Kode Berikut Didalamnya  

<style>#facebook-oktri,#twitter-oktri,#salingsapa-oktri,#plurk-oktri{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-oktri {background:-moz-linear-gradient(top,#001C5A,#001551);background: -webkit-gradient(linear, left top, left bottom, from(#001C5A), to(#001551));top:350px;}#facebook-oktri:hover,#twitter-oktri:hover,#salingsapa-oktri:hover,#plurk-oktri:hover{width:150px;opacity:1.0;margin-left:0;cursor:hand}#facebook-oktri a:hover,#facebook-oktri a:visited,#twitter-oktri a:hover,#twitter-oktri a:visited,#salingsapa-oktri a:hover,#salingsapa-oktri a:visited,#plurk-oktri a:visited,#plurk-oktri a:hover{text-shadow:none;color:#ffffff}#twitter-oktri {background:-moz-linear-gradient(top,#67C9E9,#029BC5);background: -webkit-gradient(linear, left top, left bottom, from(#67C9E9), to(#029BC5));top:382px;}#salingsapa-oktri{background: #51A104 -moz-linear-gradient(top,#51A104,#000);background: -webkit-gradient(linear, left top, left bottom, from(#51A104), to(#000));top:414px;}#plurk-oktri,#changeoktrihtc ul li{background: -moz-linear-gradient(top, #AF0000, #6B0000);background: -webkit-gradient(linear, left top, left bottom, from(#AF0000), to(#6B0000));}#plurk-oktri {top:446px;}</style>
<div id='plurk-oktri'><a href='URL SOBAT'target='_blank'>Plurk</a></div>
<div id='salingsapa-oktri'><a href='URL SOBAT'target='_blank'>Salingsapa</a></div>
<div id='facebook-oktri'><a href='URL SOBAT'target='_blank'>Facebook</a></div>
<div id='twitter-oktri'><a href='URL SOBATi'target='_blank'>twitter</a></div>


sebelum di save sobat sinaga ganti tulisan URL SOBAT dgn Url Sobat sendri !!!

Dan yg trakhir sobat SAVE dech !!!

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

{ 1 komentar... read them below if any or add comment }

₥ɍ ᾶbיִ₥ mengatakan...

blogwalking sob :D
http://itcxmrsbii.blogspot.com/

Posting Komentar

 
FASTSEO - SEO Friendly Blogger Template Design by Tutorial SEO Blogspot