L’effet « Parallax Scrolling » , en 11 lignes de jQuery, A Unix Mind In A Windows World

Le « parallax lors du défilement de la page  » – traduction littérale de Parallax Scrolling  – est une technique de webdesign qui consiste à faire défiler l’arrière plan d’une div à une vitesse différente de son contenu.
Mais si, vous savez ce que c’est : regardez l’effet sur l’arrière de votre profile twitter, et vous aurez une bonne idée de ce qu’est l’effet parallaxe.
En gros, ça donne quelque chose comme ça .
Oui …  c’est, avec le flat design, l’une des techniques les plus utilisées actuellement en matière de webdesign . C’est d’ailleurs la raison pour laquelle plusieurs plugins et tutoriaux sont consacrés à la création d’un effet parallaxe.
La plus simple – donc ma favorite  – est le code ci dessous : il est basé sur le tutoriel « A Simple Parallax Scrolling Technique  » dont j’ai modifié un peu le script (afin d’assigner $(window) à une variable, et d’utiliser des div en lieu et place des sections ) .Vous pourrez vous en servir pour reproduire l’effet parallaxe sur votre site web.
Vous pouvez également consulter (ou modifier) le code et son résultat sur l’espace codepen dédié à cet effet.

Loading ….