Membuat Menu Slid-Box

Minggu, 02 Desember 2012

Slid-Box ini hampir sama dengan widget dengan tampilan floating, tetapi pada widget ini tampilan yang akan muncul sedikit lain yaitu akan tampil atau bergerak/tampil dari kanan kekiri ketika halaman dari blog anda diarahkan ke akhir halaman dan akan tertutup secara otomatis ketika halaman di arahkan kembali keatas.

Sobat dapat menempatkan apa saja kedalam widget ini, Dan untuk membuat sangatlah mudah.

Cara Memasang:

Buka Layout Page Elemen
Klik Add Gadget
Pilih HTML/Java Script

Kemudian Tempatkan Kode Berikut:

<script type="text/javascript" src="http://marewainfo.googlecode.com/files/slidboxordinary.js"></script>   
<div style="position:fixed; width:342px; overflow:hidden; bottom:20px;   
right:10px; display:none;  
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAv9FgAxF-Ril9OIC7naRXV79990dnKXnKpZqpduEdVnjC8DKW4PtcEXzXihKq8WnSifQtnox1xQKLo9bYS71V85yBNN3ae9in2qFbgkAHpY12zJq4qwIOLdWRm3PKSwF2_2NWJXGf2f-1/s0/bo-bg-html.gif)   
repeat; -moz-border-radius:15px; -webkit-border-radius:15px;   
border-radius:15px; border:2px solid #111111;" id="fbslidebox">
   
   
    <div style="width:320px; padding:10px; margin:0 auto; overflow:hidden;">
   
   
        <a href="#" style="float:right; color:#999; padding:0 3px;   
border:1px solid #CCC; text-decoration:none; font-size:9px; font-family:Verdana, Geneva, sans-serif;" id="fbcloseslidebox">X</a>   
   
        <strong style="color:#66ad3d;">Untuk Judul Slid-Box</strong>   
   
///Tempatkan apa saja yang sobat inginkan (gambar,script, facebook dan lain-lain//  
  
        </div>
</div>
   </span><br />
<span style="font-family: Arial, Verdana;"><span style="font-size: 14px; line-height: 20px;"><br /></span></span>