Come fare Scroll cumulativo di offset in jQuery

July 21

JQuery è un linguaggio di scripting basato su JavaScript che viene utilizzato per lo sviluppo di applicazioni Web interattive. La libreria jQuery offre una ricca varietà di funzioni per l'interazione con il modello del documento oggetto, server esterni e l'input dell'utente. Ad esempio, con funzioni di jQuery, è possibile progettare una pagina Web in cui l'utente può scorrere senza intoppi e automaticamente ai diversi punti del documento.

istruzione

1 Importare la libreria jQuery nel file HTML usando il tag "<script>" posta nella testa del documento come segue:

<Script src = "jquery.js"> </ script>

Ciò presuppone che la libreria jQuery risiede sul server e nella stessa cartella del documento. Avrai bisogno di aggiungere un percorso se la libreria risiede altrove o su un altro server.

2 Creare un nuovo contenitore script per tenere il vostro codice jQuery. Avvolgere il codice in una funzione che verrà chiamato quando il documento è pronto:

<Script>
startEventHandlers function () {
// Codice andrà qui
}
$ (Document) .ready (startEventHandlers);
</ Script>

3 Utilizzare il seguente codice per selezionare un elemento con id "scrollToMe" più un offset quando un elemento con id "scrollNow" viene cliccato. Il parametro "1000" animerà il rotolo per 1.000 millisecondi, o un secondo.

$ ( "# ScrollNow"). Cliccare ({
$ ( "Html, body"). Animare ({
scrollTop:.. $ ( "# scrollToMe") offset () top + myOffset;
}, 1000);
});

Il metodo jQuery ".Offset ()" rileva la posizione assoluta dell'elemento dall'alto del documento, in cui il metodo ".position ()" registra l'offset relativo elementi padre. La variabile "myOffset" può essere una costante o calcolata sulla base di altri elementi del documento per produrre un effetto di scorrimento cumulativo.