Scroll della pagina con jQuery

ATTENZIONE! Il post ha più di 2 anni e le informazioni contenute potrebbero essere obsolete (ad esempio a causa di un aggiornamento di versione rispetto agli elementi descritti o links modificati da siti esterni).

Due semplici funzioni per effettuare lo scroll della pagina con jQuery:

/**
* Effettua lo scroll della pagina fino al selettore passato come parametro
*/
function scrollToSelector(selector){
    var where = $(selector).offset().top;
    $("html,body").animate({scrollTop: where+15}, 500, function() {
        //animazione completata
    });
    return false;
}

/**
* Effettua lo scroll della pagina fino alla posizione passata come parametro
*/
function scrollToPosition(position){
    $("html,body").animate({scrollTop: position}, 500, function() {
        //animazione completata
    });
    return false;
}

ed ecco come utilizzarle:

//scroll alla posizione di un elemento
scrollToSelector($('#id_elemento'));

//scroll a posizione predefinita (300px)
scrollToPosition(300);

NOTA: per la funzione scrollToSelector() non è possibile utilizzare un elemento nascosto in quanto jQuery al momento non rileva la posizione di un elemento non visibile.

Condividi questo post


Commenti