Défilement vertical symptahique
Date : 27/11/07 15:15:16
Si vous appréciez cet article cliquez sur ce bouton : 
Souvent lorsque les pages webs sont longues et s'étirent verticalement on ajoute en bas de page un petit lien Haut de page pour remonter tout en haut de celle-ci et ainsi éviter de nous user les doigts sur notre molette de souris.
J'ai découvert il y a peu un petit script en javascript qui permet de rendre cette action bien plus agréable à l'œil. Je suis tombé dessus sur un portfolio très intéressant : Deziner Folio. C'est un site à découvrir d'urgence il est plein de truc utile pour les créateurs en herbe que nous sommes.
L'auteur à appelé son effet Smooth Scroll donc on fait de même...
L'installation est simplissime : on télécharge le petit fichier .js, il est disponible sur mon site puisque le site de l'auteur parait avoir quelques soucis en ce moment : Clique droit et enregistrer sous....
Ensuite on upload le fichier .js sur notre serveur. On peut le placer dans un répertoire que l'on appellera /js/ par exemple.
Dans les balises <head> et </head> on appel notre fichier javascript de cette façon :
Et voila le plus dur est fait, maintenant il suffit de pointer un lien vers une ancre pour avoir l'effet voulu.
Prenons un exemple, dans ma page je veux remonter au niveau du lien Accueil, donc j'écris le lien Accueil de cette façon :
Bien sur il vous faudra adapter le lien pour votre cas la seul partie qui nous intéresse est la partie name="cequevousvoulez".
Une fois cela fais, vous écrivez votre texte qui vas prendre une tonne de phrases en tout genre, des images, des schémas, des graphiques, bref tout votre contenu. Une fois arrivé à la fin mettez un lien vers votre ancre que vous avez définis plus haut...
Dans notre exemple on se fera donc un lien de cette sorte :
Et voila c'est fini vous pouvez tester l'effet sur toutes les pages longues de mon site en cliquant en bas à droit sur Haut de page mais comme je suis super sympa je vous fais un exemple sur cette page avec du texte fictif :
Aller en bas de page Lorem ipsum dolor sit amet, consectetuer adipisci elit. Satis caritatem contineret etiam.. Sed eius enim a, tranquillat ob vexetur permagna potius voluptate eo aliae, vivamus esse solis ut non, atomis videatur in ut, mihi litteris si ante vivere, deinde emancipaverat appetendum sine erant ex metu philosophiae fatemur, et magis non corpora ne, maluisti ita locupletiorem medicorum.. Vitae teneam se inquit possit quae fore sunt approbantibus, adoptionem sunt ad sit, est philosophi epicurum distinguique sed munere quod, nomine et tanta morte ruinae detractio, cum nam voluptatibus vita ad, quieti atque perpetua in, ut desiderabile impendere, homini nec praesentibus ad omni facere, omnia.
Sanciret optime ut liberiusque.. Scribere aut, ab quid eum probabis cum, sollicitant futuris, et affecta utinam quas eum manilium studium defensa alienum et ipso hoc nos, mihi et vidit ad sin philosophi ut, ut igitur negarent democritus nobis ab quam procedat consequuntur studia modo turbulenta, modo fidelissimae possit mihi dolor, repudiandae et modum non mortis hominibus ipsum, vituperari ipsa viam dolorum enim, hoc sine, et et statua etiam munere patientiamque.. Sententiae se studiose non, dolor dolores consule aut ex divelli philosophi insequitur, inquit attico nulla degendae commodius, sensibus ignorare legatis non, perturbatur perciperet ego sit multo apertam, finibus.
Quo nostrum huic, quod qui, damna bonis istius tria amicitia rerum de quisquis afferat solida, fatemur scripta vita nec a bonum, in.. Nulla audaces in quibus si nulla voluptate expetendam hanc saepe insitam ducem maior causae.. Quo nostrum huic, quod qui, damna bonis istius tria amicitia rerum de quisquis afferat solida, fatemur scripta vita nec a bonum, in.. Spe confirmare non meminerit ut quod efficerent scientia commemorandis magis rerum, nam logikh fortitudo quibus, quem avocent epularum ac referuntur est pertinacia de dolorem delectamur detractio versuum videri ipsi, omnes tot contra non, deserere adiungimus qui tenebimus, et verterunt quidem vitae memoria facilius singulis video ante, consedit nihil, sed variis copulatas bello in quam.
Cum non quam quantumcumque.. Nec consilio cum me a extremum, miseram insitam.. De diligamus explicabo quo cupiditatum, sequimur sponte factis in qui, erimus eas si nam, iudicium vitae negant perspici tam nostrum, ex adhuc ergo, nullam.. Sed exultat si accommodare tam esset saepe, hoc rerum est iis sunt voluptatem sequatur causa dicta quidem paene voluptas, de ut, centurionum ferantur ex deinde morati sed per non, reperiri propter autem.
Ulla omnia amicos, repellendus non pecuniae firmissimum, albucius tamen potest, non ut et ratione non laudabilis apertam quam, esse.. Ut et alterum, negent eorum nominavi vulgo utrisque physicis ac potest in transferam neque in, ullam aperta modo.. Aliquam suspicio non nam autem nec, occultarum ad haec expetendas, naturae aut et horrida est possum.. Lorem ipsum dolor sit amet, consectetuer adipisci elit. Satis caritatem contineret etiam.. Sed eius enim a, tranquillat ob vexetur permagna potius voluptate eo aliae, vivamus esse solis ut non, atomis videatur in ut, mihi litteris si ante vivere, deinde emancipaverat appetendum sine erant ex metu philosophiae fatemur, et magis non corpora ne, maluisti ita locupletiorem medicorum.. Vitae teneam se inquit possit quae fore sunt approbantibus, adoptionem sunt ad sit, est philosophi epicurum distinguique sed munere quod, nomine et tanta morte ruinae detractio, cum nam voluptatibus vita ad, quieti atque perpetua in, ut desiderabile impendere, homini nec praesentibus ad omni facere, omnia.
Sanciret optime ut liberiusque.. Scribere aut, ab quid eum probabis cum, sollicitant futuris, et affecta utinam quas eum manilium studium defensa alienum et ipso hoc nos, mihi et vidit ad sin philosophi ut, ut igitur negarent democritus nobis ab quam procedat consequuntur studia modo turbulenta, modo fidelissimae possit mihi dolor, repudiandae et modum non mortis hominibus ipsum, vituperari ipsa viam dolorum enim, hoc sine, et et statua etiam munere patientiamque.. Sententiae se studiose non, dolor dolores consule aut ex divelli philosophi insequitur, inquit attico nulla degendae commodius, sensibus ignorare legatis non, perturbatur perciperet ego sit multo apertam, finibus.
Sanciret optime ut liberiusque.. Scribere aut, ab quid eum probabis cum, sollicitant futuris, et affecta utinam quas eum manilium studium defensa alienum et ipso hoc nos, mihi et vidit ad sin philosophi ut, ut igitur negarent democritus nobis ab quam procedat consequuntur studia modo turbulenta, modo fidelissimae possit mihi dolor, repudiandae et modum non mortis hominibus ipsum, vituperari ipsa viam dolorum enim, hoc sine, et et statua etiam munere patientiamque.. Sententiae se studiose non, dolor dolores consule aut ex divelli philosophi insequitur, inquit attico nulla degendae commodius, sensibus ignorare legatis non, perturbatur perciperet ego sit multo apertam, finibus.
Sanciret optime ut liberiusque.. Scribere aut, ab quid eum probabis cum, sollicitant futuris, et affecta utinam quas eum manilium studium defensa alienum et ipso hoc nos, mihi et vidit ad sin philosophi ut, ut igitur negarent democritus nobis ab quam procedat consequuntur studia modo turbulenta, modo fidelissimae possit mihi dolor, repudiandae et modum non mortis hominibus ipsum, vituperari ipsa viam dolorum enim, hoc sine, et et statua etiam munere patientiamque.. Sententiae se studiose non, dolor dolores consule aut ex divelli philosophi insequitur, inquit attico nulla degendae commodius, sensibus ignorare legatis non, perturbatur perciperet ego sit multo apertam, finibus.
Sanciret optime ut liberiusque.. Scribere aut, ab quid eum probabis cum, sollicitant futuris, et affecta utinam quas eum manilium studium defensa alienum et ipso hoc nos, mihi et vidit ad sin philosophi ut, ut igitur negarent democritus nobis ab quam procedat consequuntur studia modo turbulenta, modo fidelissimae possit mihi dolor, repudiandae et modum non mortis hominibus ipsum, vituperari ipsa viam dolorum enim, hoc sine, et et statua etiam munere patientiamque.. Sententiae se studiose non, dolor dolores consule aut ex divelli philosophi insequitur, inquit attico nulla degendae commodius, sensibus ignorare legatis non, perturbatur perciperet ego sit multo apertam, finibus.
Sanciret optime ut liberiusque.. Scribere aut, ab quid eum probabis cum, sollicitant futuris, et affecta utinam quas eum manilium studium defensa alienum et ipso hoc nos, mihi et vidit ad sin philosophi ut, ut igitur negarent democritus nobis ab quam procedat consequuntur studia modo turbulenta, modo fidelissimae possit mihi dolor, repudiandae et modum non mortis hominibus ipsum, vituperari ipsa viam dolorum enim, hoc sine, et et statua etiam munere patientiamque.. Sententiae se studiose non, dolor dolores consule aut ex divelli philosophi insequitur, inquit attico nulla degendae commodius, sensibus ignorare legatis non, perturbatur perciperet ego sit multo apertam, finibus.
Quo nostrum huic, quod qui, damna bonis istius tria amicitia rerum de quisquis afferat solida, fatemur scripta vita nec a bonum, in.. Nulla audaces in quibus si nulla voluptate expetendam hanc saepe insitam ducem maior causae.. Quo nostrum huic, quod qui, damna bonis istius tria amicitia rerum de quisquis afferat solida, fatemur scripta vita nec a bonum, in.. Spe confirmare non meminerit ut quod efficerent scientia commemorandis magis rerum, nam logikh fortitudo quibus, quem avocent epularum ac referuntur est pertinacia de dolorem delectamur detractio versuum videri ipsi, omnes tot contra non, deserere adiungimus qui tenebimus, et verterunt quidem vitae memoria facilius singulis video ante, consedit nihil, sed variis copulatas bello in quam.
Cum non quam quantumcumque.. Nec consilio cum me a extremum, miseram insitam.. De diligamus explicabo quo cupiditatum, sequimur sponte factis in qui, erimus eas si nam, iudicium vitae negant perspici tam nostrum, ex adhuc ergo, nullam.. Sed exultat si accommodare tam esset saepe, hoc rerum est iis sunt voluptatem sequatur causa dicta quidem paene voluptas, de ut, centurionum ferantur ex deinde morati sed per non, reperiri propter autem.
Ulla omnia amicos, repellendus non pecuniae firmissimum, albucius tamen potest, non ut et ratione non laudabilis apertam quam, esse.. Ut et alterum, negent eorum nominavi vulgo utrisque physicis ac potest in transferam neque in, ullam aperta modo.. Aliquam suspicio non nam autem nec, occultarum ad haec expetendas, naturae aut et horrida est possum.. Haut de page
Ecrire un commentaire
- Les champs indispensables sont marqué avec le caractère*.