Home > javascript > Scroll della pagina con jQuery

Scroll della pagina con jQuery

27 ottobre 2011 No Comments

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.

Tags: animazioni javascript jquery

Lascia un Commento

L'indirizzo email non verrà pubblicato. I campi obbligatori sono contrassegnati *

*

È possibile utilizzare questi tag ed attributi XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>