Buku Tamu UniK dengan efek Scroll

Tamu adalah seseorang atau sekelompok orang yang datang untuk mengunjungi sesuatu atau organisasi, untuk kepentingan pekerjaan baik kedinasan maupun pribadi. Tamu yang berkunjung ketempat dimana kita berkerja harus dihormati dan dihargai.

1. Masuk ke Rancangan / Design
2.  Elemen Laman / Page Element
3. Tambah Gadget / Add a Gadget
4. HTML / Javascript
5. Paste Kode berikut :

<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript"> $(document).ready(function(){ $(".gbbtn").click(function(){ $("#gbcontent").slideToggle("slow"); $(this).toggleClass("active"); return false; }); }); </script> <style> /* --------------- Guestbook dengan jQuery by :sanggar-belajar.blogspot.com Url : http://sanggar-belara.blogspot.com/ ---------------------------------- */ .gb { position:fixed; top:0px; left:0px; z-index:+10; } #gbcontent { height: auto; background: #898787; width: auto; display: none; padding: 10px; border: #000; -moz-border-radius-topright:10px; -webkit-border-top-right-radius:10px; -moz-border-radius-bottomright:10px; -webkit-border-bottom-right-radius:10px; -moz-border-radius-topleft:10px; -webkit-border-top-left-radius:10px; -webkit-border-bottom-left-radius:10px; } .gbslide { float:left; margin: 0; padding: 0; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQnRGP40kpHlZl-_WkktcU7I96zWiEIx7caEINcUDTo4rvd-sjtpAcTBgRtRUFWb7aPTG4oPxulQt7opzE97TbP-136Xjqg1blbd3UKod-bsl6Olq_Am_GUOk6tNOFdcuhokGgc-BabCo/s1600/gbslide.png) no-repeat center top; } .gbbtn { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuzqCCzfFzMJ8zdRvLneJszR3_vyD88a9nodKUiQMm47_hDHbhiQ7wAvFsM0Mh1M6EtJfAnjw9yFeIJ1a__3DXWZPUGlGKnFBAyV6jYLCR8toJzoJ4x78aVASF3dGBTg0h-LdKHpku3ls/s1600/button-Close-open2.png) no-repeat right -45px; text-align: center; width: 144px; height: 31px; padding: 10px 10px 0 0; margin: 0 auto; display: block; font: bold 120%/100% Arial, Helvetica, sans-serif; color: #CCC; text-decoration: none; } .active { background-position: right 12px; } </style> <div class="gb"> <div id="gbcontent">Guestbook <!-- Simpan Kode buku tamunya disini --> </div> <p class="gbslide"><a href="#" class="gbbtn">Guestbook</a></p></div>

 Note : Apabila kode yang berwarna merah sudah terdapat di blog sobat, tidak perlu lagi ditambah
            Ganti Kode yang berwarna biru dengan kode script guestbook sobat
            Ganti Kode yang berwarna hijau dengan Kata kata yang sobat inginkan

Demo Click here

Tweet

Ditulis Oleh: wisata pisak at 6:54 AM