Animasi Sticky Widget Sidebar Blogger

Animasi Sticky Widget Sidebar Blogger - Animasi jQuery untuk widget float (melayang) mengikuti layar ketika layar di gulung ini seperti kita membuat sticky widget sidebar sebelumnya, namun pada kesempatan kali ini script yang dipergunakan lebih ringkas dan dengan penambahan animasi ketika layar digulung.

Animasi sticky widget sidebar blogger ini lebih halus ketika layar digulung dan widget pun mengikuti layar tersebut.

Untuk menentukan widget mana yang akan dijadikan melayang (float) kita harus tentukan id atau class pada widget tersebut, dan jQuery yang dipergunakan adalah seperti dibawah ini:

$(function() {

    var offset = $("#sidebar").offset();
    var topPadding = 15;

    $(window).scroll(function() {
    
        if ($(window).scrollTop() > offset.top) {
        
            $("#sidebar").stop().animate({
            
                marginTop: $(window).scrollTop() - offset.top + topPadding
            
            });
        
        } else {
        
            $("#sidebar").stop().animate({
            
                marginTop: 0
            
            });
        
        }
        
            
    });

});

Letakan jQuery tersebut diatas </head>

Jangan lupa untuk menentukan salah satu id atau class widget pada sidebar atau id atau class sidebar untuk float animasi ini.

Pemilihan sticky widget sidebar menggunakan animasi jQuery ini lebih halus ketika layar digulung dan widget pun akan mengikuti layar dengan animasi yang kita buat.

Semoga bermanfaat dan mudah untuk diterapkan pada blog tercinta yang kita punya ini.