Je suis tombé sur ce site web aujourd'hui et j'ai été mystifié: http://www.actionbutton.net/
utilise-t-il une technique connue pour ses arrière-plans qui défilent à un taux différent et se chevauchent mutuellement. J'ai regardé la source mais je suis assez confus. Est-ce que quelqu'un sait ce que la technique est appelée et comment l'apprendre?
3 Réponses :
L'appel Parallaxe Il y a beaucoup de plugin pour ce par exemple. http://www.ianlunn.co.uk/plugins/jquerery-parallax/
Vous pouvez également considérer quelque chose comme ça (aucun JavaScript n'est requis):
@keyframes backgroundscroller {
from {
background-position: 0% 0%;
}
to {
background-position: 500% 500%, 400% 400%, 300% 300%, 200% 200%, 100% 100%;
}
}
#yourdivid {
background-image: url('full/sprite1.png'), url('512/sprite2.png'), url('256/sprite3.png'), url('128/sprite4.png'), url('64/sprite5.png');
animation-name: backgroundscroller;
animation-duration: 300s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction: normal;
}
Je suis curieux de votre approche, mais cela ne suffit pas pour que quelqu'un d'autre suive. J'ai créé un div avec du texte, mais cela ne fait rien ... Pourriez-vous écrire quelque chose un peu plus complet?
Voici une approximation de l'effet de parallaxe qui n'utilise pas JS (Ainsi, les arrière-plans défilent à la vitesse constante). L'exemple Jfiddle: http://jsfiddle.net/mfc9b/2/
La clé est qu'il y a 2- Couche DIV imbriquée, l'externe pour maintenir l'arrière-plan, l'intérieur pour maintenir le contenu:
?? Vous avez le site Web, alors venez-vous de voir la source et de la comprendre?