Image qui change quand je me deplace en Y
Kahla
-
Rostov -
Rostov -
Bonjour,
Actuellement étudiante en web, je reste une novice et j'ai donc besoin de votre aide.
Voila mon problème:
Je fais un test en HTML/CSS et pour un test j'ai fait cette image : http://s7.postimage.org/rnnjp8uqf/imagetest.jpg
Mon but est qu'au début on voit juste le rectangle rouge qui reste fixe au centre de l'écran en css, ça j'y suis facilement arrivé.
Mon problème est : Quand je fais défiler ma page de gauche à droite, j'aimerais que mon rectangle rouge passe au : rose, puis au violet et enfin au bleu.
Je suppose qu'il faut un : background-position:left;
Mais il me manque les codes pour qu'il l'applique quand je me déplace en Y.
Si le CSS3 le permet (peut être avec une transition ?) je le préférerait à du Javascript, mais je suis ouverte à toutes vos suggestions :-)
Je ne sais pas si j'ai était très claire...
Pouvez vous m'aider ?
Actuellement étudiante en web, je reste une novice et j'ai donc besoin de votre aide.
Voila mon problème:
Je fais un test en HTML/CSS et pour un test j'ai fait cette image : http://s7.postimage.org/rnnjp8uqf/imagetest.jpg
Mon but est qu'au début on voit juste le rectangle rouge qui reste fixe au centre de l'écran en css, ça j'y suis facilement arrivé.
Mon problème est : Quand je fais défiler ma page de gauche à droite, j'aimerais que mon rectangle rouge passe au : rose, puis au violet et enfin au bleu.
Je suppose qu'il faut un : background-position:left;
Mais il me manque les codes pour qu'il l'applique quand je me déplace en Y.
Si le CSS3 le permet (peut être avec une transition ?) je le préférerait à du Javascript, mais je suis ouverte à toutes vos suggestions :-)
Je ne sais pas si j'ai était très claire...
Pouvez vous m'aider ?
A voir également:
- Image qui change quand je me deplace en Y
- Change dns - Guide
- Image iso - Guide
- Image en 3d qui bouge - Télécharger - Thèmes & Fonds d'écran
- Reduire taille image - Guide
- Acronis true image - Télécharger - Sauvegarde
2 réponses
Bonjour, vous parlez d'interactivité.
CSS c'est de l'affichage et non de l'interactivité(ou très limité et plutôt une astuce que de la vrai interactivité comme l'image de fond qui va changer quand vous passez la souris sur un lien).
Pour l'interactivité l faut utiliser un langage de programmation (javascript par exemple), flash ou peut être HTML5 mais je ne pourrais vous dire pour ce dernier.
On parles de programmation événementielle en javascript(ce qui en fait tout l'intérêt et a rendu populaire son utilisation dés le début d'internet).
événementiel ou interactivité c'est similaire. Cela veut dire que lors d'une action il se passe quelque chose(outre le lien qui est signifié par le 'H' de HTML-hypertexte):
Pour se déplacer en y il faut obtenir la position de base et obtenir ce déplacement, ce déplacement est donc un événement.
Pour javascript vous avez ce site où vous trouverez cours, exemples et codes tout faits:
http://www.toutjavascript.com/main/index.php3
D'autres ressources sur ce site:
http://www.editeurjavascript.com/
Et bien d'autre Google st votre ami.
CSS c'est de l'affichage et non de l'interactivité(ou très limité et plutôt une astuce que de la vrai interactivité comme l'image de fond qui va changer quand vous passez la souris sur un lien).
Pour l'interactivité l faut utiliser un langage de programmation (javascript par exemple), flash ou peut être HTML5 mais je ne pourrais vous dire pour ce dernier.
On parles de programmation événementielle en javascript(ce qui en fait tout l'intérêt et a rendu populaire son utilisation dés le début d'internet).
événementiel ou interactivité c'est similaire. Cela veut dire que lors d'une action il se passe quelque chose(outre le lien qui est signifié par le 'H' de HTML-hypertexte):
Pour se déplacer en y il faut obtenir la position de base et obtenir ce déplacement, ce déplacement est donc un événement.
Pour javascript vous avez ce site où vous trouverez cours, exemples et codes tout faits:
http://www.toutjavascript.com/main/index.php3
D'autres ressources sur ce site:
http://www.editeurjavascript.com/
Et bien d'autre Google st votre ami.