BullGuard Antivirus Sale - 60% Off with openElement !
Accueil Forum Accueil Forum >

openElement

> Tutoriaux utilisateurs
  Nouveaux messages Nouveaux messages Fil RSS  - Effet parallaxe simplifié
  FAQ FAQ  Rechercher dans le Forum   Inscription Inscription  Connexion Connexion

Effet parallaxe simplifié

 Répondre Répondre
Auteur
Message
Bridet allez vers le bas
Senior Member
Senior Member
Avatar

Depuis le: 13 Dec 2013
Pays: Condroz
Status: Inactif
Points: 5049
Options des messages Options des messages   Thanks (1) Thanks(1)   Citer Bridet Citer  RépondreRéponse Lien Direct à ce Post Sujet: Effet parallaxe simplifié
    Envoyé : 21 Juil 2016 à 09:30
Brolysan propose ceci (ici l'effet : http://guidepolonais.com/) :

Panneau d'éléments ou cadre sur la page
largeur au choix (pour mes sites, c'est 100%) et hauteur fixe
Ensuite, vous ajoutez une image de fond par le menu du haut avec une répétition sur fixe
allez ensuite dans Styles ( menu de droite) puis Personnalisation
Ouvrez le menu Arrière plan
mettez ses paramètres suivants :
Image mobilité : Fixe
Image Position : milieu
Taille (CSS3) : Prédéfinie Cover (couvrir)

Larsène rajoute ceci :

Brolysan a donné la façon la plus simple d'imiter cela.

Sinon, il suffit de mettre en place http://pixelcog.github.io/parallax.js/

Il suffit de suivre les infos !

Merci à eux!

Haut de la page
brolysan allez vers le bas
Admin Group
Admin Group
Avatar

Depuis le: 14 Août 2009
Pays: France
Status: Inactif
Points: 10144
Options des messages Options des messages   Thanks (0) Thanks(0)   Citer brolysan Citer  RépondreRéponse Lien Direct à ce Post Envoyé : 21 Juil 2016 à 09:49
Si tu veux voir un vrai effet parallax, j'ai fait ce site web.
L'idée de base du parallax est que l'image en arrière plan bouge différemment par rapport aux autres lors du scroll. L'astuce donnée plus haut est la même idée sauf que l'image est fixe mais donne déjà un bel effet sympa du moment que l'on réfléchit bien à l'image utilisée.
Haut de la page
Bridet allez vers le bas
Senior Member
Senior Member
Avatar

Depuis le: 13 Dec 2013
Pays: Condroz
Status: Inactif
Points: 5049
Options des messages Options des messages   Thanks (0) Thanks(0)   Citer Bridet Citer  RépondreRéponse Lien Direct à ce Post Envoyé : 21 Juil 2016 à 10:23
J'avoue que la différence ne me saute pas aux yeux!
Haut de la page
Hobby001 allez vers le bas
Admin Group
Admin Group
Avatar
Modérateur

Depuis le: 14 Feb 2015
Pays: Canada, Québec
Status: Inactif
Points: 6508
Options des messages Options des messages   Thanks (0) Thanks(0)   Citer Hobby001 Citer  RépondreRéponse Lien Direct à ce Post Envoyé : 21 Juil 2016 à 13:24
Message posté par Bridet Bridet a écrit:

J'avoue que la différence ne me saute pas aux yeux!

Regardez ce site, l'effet parallaxe sur scroll donne des vitesses de déplacement différentes aux différents éléments.

http://www.videotron.com/residentiel/television
Haut de la page
brolysan allez vers le bas
Admin Group
Admin Group
Avatar

Depuis le: 14 Août 2009
Pays: France
Status: Inactif
Points: 10144
Options des messages Options des messages   Thanks (0) Thanks(0)   Citer brolysan Citer  RépondreRéponse Lien Direct à ce Post Envoyé : 21 Juil 2016 à 13:50
oui, il est sur 3 images par panneau...y a du taff là, pour arriver à faire ça dans OE.
Haut de la page
 Répondre Répondre
  Partagez ce sujet   

Aller au Forum Permissions du forum allez vers le bas

Forum Software by Web Wiz Forums® version 12.04
Copyright ©2001-2021 Web Wiz Ltd.

Cette page a été affichée en 0.063 secondes.