MICHELEPISANI.IT

I plugins di jQuery più utilizzati nel web

Bottone con funzione per tornare al top della pagina

Torna in cima alla pagina con jquery.page-scroller.js

Luglio 02
07:042014

Una delle funzioni che troviamo molto spesso nelle pagine dei siti web, come anche in questa di cui ne state leggendo il contenuto, è quella per tornare in cima alla pagina stessa con un click su un bottone/link posizionato solitamente in basso a destra della pagina e che rimane fisso nella stessa posizione.

L'implementazione di tale funzione è di immediata realizzazione, basterà disporre della libreria di jquery e del plugin chiamato jquery.page-scroller (il sito di colui che ha realizzato il plugin in questione è in giapponese, potete tuttavia copiare il contenuto di tale plugin dal tab "Javascript" del mio esempio di JSFiddle riportato poco sotto).

Il cuore del codice HTML e CSS necessario al funzionamento è semplicemente il seguente:


<style type="text/css">
#content {width: 250px;height: 1000px;background-color: #00aa00;color: #000;padding:10px}
#return_top {position: absolute;position: fixed;right: 0px;bottom: 0px;padding:0 15px 40px 0}
</style>

<div id="content">...contenuto dell pagina web...</div>

<div id="return_top"> <a href="#content">Torna su</a> </div>



Nel tab "Result" dell'esempio di seguito potete apprezzarne l'effetto dal vivo.

Tags
Condividi

Autore

Michele Pisani

Michele Pisani

Ho uno spiccato orientamento al problem-solving, se è troppo facile non mi diverto :)
Credo nella volontà e nel cambiamento perchè hanno fatto della mia passione il mio pane quotidiano.
Se devo descrivermi con una sola parola direi... "Concretezza", la mia stretta di mano è una garanzia.

0 Commenti

Non ci sono commenti

Nessuno ha ancora commentato questo articolo, fallo tu per primo!

Scrivi un Commento

Scrivi un Commento

Il tuo indirizzo email non sarà pubblicato.
I campi contrassegnati da un * sono obbligatori

Articoli e Argomenti correlati

Categorie popolari

Iscriviti alla mia newsletter

La tua e-mail con me sarà al sicuro.
Non fornirò mai le tue informazioni a nessuno!

Ultimi commenti

Umberto

Grazie Michele, in realtà faccio un po' fatica a districarmi con l'assistenza di FB... Ora provo e …

Michele Pisani

Ciao Umberto,
hai provato a contattare il supporto tramite la community?

Umberto

Salve, dopo un paio di mesi di tentativi e di modifiche, sono riuscito a far partire la procedura …

Rosa

Salve. Sto unendo due Pagine. Tutto è stato da me 'omogeneizzato', quindi coi nomi simili ci siamo …