Kali ini saya akan memposting "Cara Memasang Buku Tamu Unik di Blog.
Biasanya pada blog-blog orang lain terdapat buku tamu, nah biasanya cara
pemasangan buku tamu berbeda-beda, ada yang memasang dengan cara biasa,
ada juga dengan cara menyembunyikannya. Nah saya akan menjelaskan
bagaimana cara memasang buku tamu di blog dengan teknik floating. Nah
langsung saja langkah-langkahnya sebagai berikut :
Klik "Tambah Gadget" pada blog anda lalu pilih "HTML/JavaScript" dan letakkan script berikut di dalam formulirnya
<div style="position:fixed; left:0px; bottom:0px;"> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script> <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js'></script> <script type="text/javascript"> $(document).ready(function(){ $(".btn-slide").click(function(){ $("#panel").slideToggle(600, "easeOutBounce") $(this).toggleClass("active"); return false; }); }); </script> <style type="text/css"> a:focus {outline: none; } #panel {background: #555;border:1px solid #000; color:#FFFFFF; height: auto;display: none;text-align:justify; } .slide {margin: 0;padding: 0;border-top: solid 4px #422410; background: #000 no-repeat center top; } .btn-slide { background: no-repeat right -50px; text-align: center;width: 70px; height: 15px; padding: 3px 3px 0 0; margin: 0 auto; display: block; font: bold 120%/100% Arial, Helvetica, sans-serif; color: #fff; text-decoration: none; } .active { background-position: right 12px; }</style> <div id="panel">Script Buku Tamu anda atau bisa juga widget yang lain<br /> </div><p class="slide"><a href="#" class="btn-slide"></a></p></div>
- Pada text color:#FFFFFF; anda bisa ganti dengan warna lain.
- Lalu pada baris background: url(URL ANDA).
- Anda juga dapat merubah letak floatingnya yaitu dengan merubah pada
<div style="position:fixed; left:0px; bottom:0px;"> atau bisa
juga menghapusnya.
- Kemudian pada baris $("#panel").slideToggle(600, "easeOutBounce") anda
dapat merubah tulisan "easeOutBounce" dapat di ganti dengan :
-"easeInBack" atau "easeOutBack" atau "easeInOutBack" dan dapat di
lihat hasilnya sendiri.
- Anda pun dapat merubah kecepatan animasi pada baris (600,
"easeOutBounce") anda dapat mengganti angka 600 dengan angka lain,
semakin besar angka maka effect animasi semakin lambat.
gak bisa punh.....
BalasHapus