Cara Menciptakan Widget Fixed Scroll - Tempat Blogging

Cara Menciptakan Widget Fixed Scroll



Cara Membuat Widget Fixed Scroll - Bingung mau ngasih judul apa di postingan ini, cuma pada dasarnya tips ini berkhasiat buat teman yang ingin menampilkan suatu widget di blog, entah widget di sidebar, sajian atas, atau header, dll posisinya tetap berada diatas saat mouse kita scroll kebawah.

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

Cara Membuat : Cara nya sangatlah gampang :

Pertama : Paste isyarat dibawah ini di atas tag </ body> dalam template Blogger sobat, lalu paste isyarat 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 goresan pena 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

Show comments
Hide comments

0 Response to "Cara Menciptakan Widget Fixed Scroll"

Post a Comment

Blog ini merupakan Blog Dofollow, karena beberapa alasan tertentu, sobat bisa mencari backlink di blog ini dengan syarat :
1. Tidak mengandung SARA
2. Komentar SPAM dan JUNK akan dihapus
3. Tidak diperbolehkan menyertakan link aktif
4. Berkomentar dengan format (Name/URL)

NB: Jika ingin menuliskan kode pada komentar harap gunakan Tool untuk mengkonversi kode tersebut agar kode bisa muncul dan jelas atau gunakan tool dibawah "Konversi Kode di Sini!".

Klik subscribe by email agar Anda segera tahu balasan komentar Anda

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel

close