Senin, 07 November 2011

Cara Membuat Floating Widget

Floating widget ini adalah widget yang bentuknya dinamis, tidak hanya pada kolom widget. Biasanya floating ini disembunyikan disebelah kanan atau kiri pada blog, misalnya saja widget buku tamu atau sponsor

Langsung saja
1. Login ke blog dulu.
2. Pilih Rancangan - Elemen Laman - Tambah Gadget - Pilih HTML/JavaScript. sebaiknya widget tidak usah diberi judul
3. Masukkan kode dibawah ini



<style type="text/css">  
  .gb_fixed{  
      position:fixed;  
      top:80px;  
      right:0px;  
      z-index:+10;  
  }  
  
  * html .gb_fixed {position:relative;}  
  #hidden_gb2 {  
      display:none;  
      border:2px solid gray;  
      background:#111;  
      padding:10px;  
      padding-top:0px;  
  }  
</style>  
<div class="gb_fixed">  
  <table id="hidden_gb2" cellpadding="0" cellspacing="0">  
    <tr><td>  
      <div> <a href="javascript:void(0)" onclick="gb_showHideGB()"><img src="https://www.bookonthenet.net/east/RKEres/Images/CloseButtonHot.bmp" /></a> </div>  
  
   tempatkan apa saja disini  
  
<p>        
<span style="font-size: 80%;">    
 <a href="http://www.mahmudista-tutorial.com">mahmudista tutorial</a></span></p>  
  </td></tr></table>  
</div>  
  
<script src="http://marewainfo.googlecode.com/files/ordinaryhack-floating.js"></script>  
<div style="z-index:+5" class="gb_fixed">  
<a href="javascript:void(0)" onclick="gb_showHideGB()">  
<img border="0" src="http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png" style="filter: alpha(opacity=60);     
opacity: 0.6;"  
 />  
</a>  
</div> 

4. Simpan

0 komentar:

Posting Komentar