Cara Membuat Halaman Klikfloat Widget | Givuin

Posting kali ini, saya akan memberi tutorial cara membuat halaman klikfloat/ widget klikfloat. Widget ini bisa sobat lihat di widget 'pesan' yang ada di kanan, menempel di layar. Halaman klik float sangat membantu kita lho sobat!, kenapa? kita lihat yuk!!
Halaman ini sangat membantu kita untuk menyembunyikan widget2 seperti pesan, chatting, salam pembuka, share widget, dan iklan. Jadi pengunjung blog sobat dapat menyampingkan(float) widgetnya, agar tidak mengganggu saat membaca konten. Berikut cara pembuatannya! :


          1. Masuk www.blogger.com
          2. Pilih Rancangan
          3. Pilih tambah widget
          4. Pilih html/javascript

<style type="text/css">                      #nempel{position:fixed;top:65px;z-index:+1000;}                                                 * html #nempel{position:relative;}    .nempeltab{height:100px;width:30px;float:left;cursor:pointer;background: #C6DAF5 url('http://lh5.ggpht.com/_xcD4JK_dIjU/Stq23DPOQUI/AAAAAAAADhQ/2imPnFpVUrA/d/floatnav.jpg')no-repeat;}            .nempelisi{float:left;border:2px solid #000000;background:#D2E9FA;padding:8px;}                            </style>                                                                          <script type="text/javascript">function showHideNempel(){var nempel = document.getElementById("nempel");var w = nempel.offsetWidth;nempel.opened ? moveNempel(0, 30-w) : moveNempel(20-w, 0);nempel.opened = !nempel.opened;}function moveNempel(x0, xf){var nempel = document.getElementById("nempel");var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1;var x = x0 + dx * dir;nempel.style.right = x.toString() + "px";if(x0!=xf){setTimeout("moveNempel("+x+", "+xf+")", 10);}}</script>                                                                             Tempat kata2 atau script                                                                                                                                                             <div style="text-align:right;"><a style="text-decoration:none; font-family:Arial, Helvetica, sans-serif; font-size: 12px;" href="javascript:showHideNempel()">[Close]</a></div>                                             </div><script type="text/javascript">var nempel = document.getElementById("nempel");nempel.style.right = (30-nempel.offsetWidth).toString() + "px";</script></div>

         dan simpan. nih hasilnya

           nb : kata2 merah bisa diganti


kalou udah semua, tinggal di liat di blog. Isinya bisa macem2, pokoknya manfaaatkan sebagus mungkin. salam blogger


nb: lihat juga cara membuat halman melayang

Share on Facebook Share on Twitter Share on Google Plus

About buruh negara

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.