4 plugins jQuery pour un effet de Parallaxe

L’effet de Parallaxe ou plus précisément de Défilement Parallaxe nous est décrit comme cela par Wikipédia (paragraphe « défilement différentiel ») :

Le défilement différentiel (ou parallax scrolling) est une technique (très utilisée sur les consoles et ordinateurs 16 bits) qui vise à donner une impression de profondeur à travers des portions de décors défilant à vitesse légèrement variable. On peut parler de « perspective de mouvement ».

Pour obtenir cette perspective de mouvement sur un site web, il existe des plugins jQuery pour faciliter sa mise en place. Il y a 2 manières différentes de le mettre en place : la parallaxe se fait au mouvement de la souris ou bien elle se fait sur le scroll.

Je t’ai donc préparé une liste des 4 meilleurs plugins jQuery pour faire cet effet, en espérant que cela puisse t’aider et/ou t’inspirer :

Curtain.js

Ce plugin nommé Curtain.js joue sur le scroll. Il permet de faire des pages avec des « panels » multiples qui se dévoilent comme on lève un rideau. Un effet assez à la mode en ce moment. On peut aussi naviguer en utilisant les flèches du clavier.

Static Background

Ce site de démo de l’utilisation du plugin  jQuery Parallax utilise la parallaxe au niveau des images et des fonds d’écran qui bougent à des vitesses différentes.

SuperScrollorama

J’ai déjà parlé de ce plugin jQuery la semaine dernière. Il permet de faire toutes sortes d’animations animées avec le Scroll. On y retrouve bien entendu de la Parallaxe.

Stellar.js

Last but not least : Stellar.js est pour moi le plugin jQuery le plus poussé pour faire de la parallaxe. Il agit également au scroll, on peut le faire sur n’importe quel élément du DOM. De plus, je trouve la méthode pour configurer la parallaxe plutôt bien faite, à base d’attribut html.

Ce contenu a été publié dans JQuery, avec comme mot(s)-clé(s) , , . Vous pouvez le mettre en favoris avec ce permalien.

2 reponses a 4 plugins jQuery pour un effet de Parallaxe

  1. Ping : 4 plugins jQuery pour un effet de Parallaxe | JQuery, PHP, html, design… // arnaud-k : un blog de geek - moshi.fr | moshi.fr | blog moshi

  2. tvh-web.fr dit :

    Quels sont selon vous les inconvénients du parallaxe?

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *