Cara Membuat Widget Fixed Scroll

Cara Membuat Widget Fixed Scroll - Bingung mau ngasih judul apa di postingan ini, cuma intinya tips ini berguna buat sobat yang ingin menampilkan suatu widget di blog, entah widget di sidebar, menu atas, atau header, dll posisinya tetap berada diatas ketika mouse kita scroll kebawah.

Tips ini sangat berguna untuk menampilkan widget kesayangan sobat ataupun menu-menu andalan di blog, agar tidak kehilangan pandangan dari pembaca blog sobat, sehingga kemungkinan pengunjung akan melihat atau mengeklik widget tersebut sangatlah tinggi kemungkinanya.

Cara Membuat : Cara nya sangatlah mudah :

Pertama : Paste kode dibawah ini di atas tag </ body> dalam template Blogger sobat, kemudian paste kode dibawah ini diatasnya:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<SCRIPT>
$(document).ready(function() {
var div = $('#YOUR_WIDGET_ID');
var start = $(div).offset().top;
$.event.add(window, "scroll", function() {
var p = $(window).scrollTop();
$(div).css('position',((p)>start) ? 'fixed' : 'static');
$(div).css('top',((p)>start) ? '0px' : '');
});
});
</SCRIPT>

Kedua : Ubahlah tulisan yang berwarna biru diatas, dengan widget ID sobat, misal ID Header-Wrapper atau Footer-Wrapper , dll.

Ketiga : Save dan lihatlah hasilnya.

Cukup sekian, terima kasih telah membaca artikel Cara Membuat Widget Fixed Scroll. Semoga artikel ini bermanfaat.


Source code : http://viralpatel.net

Tweet