Element einblenden mit JQuery

Codeschnipsel

JQuery macht das Programmieren einfacher JQuery macht das Programmieren einfacher
Um ein Element ab einer eigens definierten Scrollposition einblenden zu können, braucht es nur wenige Anweisungen. Die Anweisungen für JQuery:
$(document).ready(function(){
    // Einblenden eines Divs, wenn gewisse "Höhe" gescrollt
    $(window).scroll(function(){
    // Schauen wo das gewünschte Div ist
        // Der Referenzwert der minimal Höhe heraus finden
        // In diesem Fall ist es ein Div#contact, welches im oberen
        // Bereich der Homepage ist
        var height = $('#contact').offset();
        // Die aktuelle Fensterposition (nach dem Scrollen)
        var current = $(window).scrollTop();
        // Umgekehrte Logik, da nach slide immer nach "oben"
        if( current < height.top ){
            $("#foot").slideUp();
        } else {
            $('#foot').slideDown();
        }
    });
});
Der Effekt, welcher auf #foot angewendet wird ist egal. Ebenfalls könnte man auch ein anderes Element, anstatt #foot, animieren.

Kommentar schreiben