Cara membuat slide-box

   Pada kesempatan ini sekedar berbagi akan membahas tentang bagaimana cara membuat slide-box
yang hampir sama dengan widget tampilan floating.tapi pada widget ini akan 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.

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


  cara memasang widget :

  buka layout page element dan klik  Add widget kemudian pilih Html/javascript

  kemudian tempatkan kode berikut :

1. <!--Slidbox -->   
2.      <script type="text/javascript" src="http://marewainfo.googlecode.com/files/slidboxordinary.js"></script>   
3. <div style="position:fixed; width:342px; overflow:hidden; bottom:20px;   
4. right:10px; display:none;  
5. background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhx4O5jfyx8GO5wGw7L-LBiDnKQQk6qXLxHeR-rAzgAd49jkxntkhXf7yqDJK77LzBpdqwcRXkkAqdGKF3SD1y5-N81jIQfUwbxxcWu0vxc9aOfj3YbHx1NEIucJ1W76aBRkhtlFRxIm4CF/s0/bo-bg-html.gif)   
6. repeat; -moz-border-radius:15px; -webkit-border-radius:15px;   
7. border-radius:15px; border:2px solid #111111;" id="fbslidebox">   
8.    
9.     <div style="width:320px; padding:10px; margin:0 auto; overflow:hidden;">   
10.    
11.         <a href="#" style="float:right; color:#999; padding:0 3px;   
12. border:1px solid #CCC; text-decoration:none; font-size:9px; font-family:Verdana, Geneva, sans-serif;" id="fbcloseslidebox">X</a>   
13.    
14.         <strong style="color:#66ad3d;">Untuk Judul Slid-Box</strong>   
15.    
16. ///tempatkan apa saja yang di ingingkan (gambar,script, facebook dan lain-lain//  
17.   
18.         </div></div>  
19. <!--Slidbox end -->

 klik simpam kemudian pada tulisan tempatkan apa saja yang dinginkan  
teman-teman bisa mengisi dengan apa yang ingin di buat slide box
 catatan :pada widget ini tidak perlu di kasih judul


                                                  selamat mencoba

Related Post: