Utiliser l’effet de parallaxe dans une section

Dans cet article, vous apprendrez à créer une section avec un effet de parallaxe pour booster l’expérience visuelle de votre page.

Tout d’abord, choisissez Ajouter un élément> Disposition> faites glisser la section complète vers la page.

Avec la section choisie> accédez à l’inspecteur d’éléments> onglet Style.

Dans la section ARRIÈRE-PLAN> Style d’arrière-plan, choisissez Parallaxe> choisissez l’image pour la source d’image

Cliquez sur le bouton Plus de paramètres et définissez la vitesse normale pour la vitesse de parallaxe

Ajustez le remplissage et la marge dans l’onglet Style de l’image.

Important: Lorsqu’une valeur fixe est définie pour le remplissage et la marge dans la vue «Tous», elle sera appliquée à toutes les autres vues (tablette et mobile) et rendra le design plus réactif par défaut. Faites défiler vers le bas pour savoir comment résoudre ce problème.

Cliquez sur Enregistrer et afficher la page.

Optimiser la conception mobile

Passez en vue mobile.

Sélectionnez la section> onglet Style> ESPACEMENT> définissez 0px pour le remplissage inférieur afin que la section n’occupe pas tout l’écran mobile et ne gâche pas l’expérience mobile.

Appuyez sur Enregistrer & publier et voyez l’effet de parallaxe fonctionner sur la page.

Si vous voulez un tutoriel vidéo sur la façon d’utiliser l’effet de parallaxe dans une section, vous pouvez consulter cette vidéo