[CSS] Background-attachement et Scroll.

Fermé
The_Moye - 6 juin 2008 à 17:22
 Matt Crack - 28 nov. 2012 à 13:23
Bonjour la populace!

Une petite question concernant l'attribut background-attachement.
Voilà, j'ai une div incluant une barre de défilement verticale, et j'aimerais que mon image d'arrière plan suive le défilement de la division.

Mais même en spécifiant l'attribut background-attachement à "scroll", l'arrière plan est fixe lorsque j'utilise la barre de défilement de cette division.

Question : est il possible de lier l'arrière plan d'une div incluant une barre de défilement au défilement?

Si oui, comment faire cela?


Merci d'avance pour votre aide :)

8 réponses

Cc je vois que sa date environ de 1 an
Mais en passant je voulais informer ceux qui sont dans le même cas
que notre ami qui n'écrit pas correctement ce propriété Css .
Dans le cas de notre ami : background-attachement <---

Faux le css n'est pas du français mais bien de l'anglais !

Donc forcement attachement s'ecrit d'une manière a l'anglaise du genre :

attachment < Ce qui nous donnerais sa : background-attachment: fixed ;
e pas de E

Voila donc si quelqu'un et dans ce cas faudra faire attention ;)

A plus
4
Spikytg Messages postés 59 Date d'inscription mercredi 17 juin 2009 Statut Membre Dernière intervention 7 décembre 2010
31 oct. 2010 à 06:27
J'ai testé! tu as raison! le background ne bouge plus du tout et c'est géniale!! MERCI beaucoup !!
0
Je viens de me rendre compte que sous IE, le défilement fonctionne (background-attachement:scroll) mais sous FF ou Opéra, rien, nada!

Toujours pas d'idées? :p
1
Brachior Messages postés 613 Date d'inscription dimanche 21 octobre 2007 Statut Membre Dernière intervention 22 juin 2009 46
6 juin 2008 à 20:11
essayes position: fixed; ^^
--
RAPPEL : Html/Javascript -> Coté Client   ||   Php -> Coté Serveur
0
Merci pour ta réponse Brachior, mais position:fixed; ne va t'il pas plutôt empêcher le défilement de mon background? ^^

Je cherche au contraire que mon arrière-plan défile avec le contenu de ma div.
0
Brachior Messages postés 613 Date d'inscription dimanche 21 octobre 2007 Statut Membre Dernière intervention 22 juin 2009 46
6 juin 2008 à 20:21
t'as essayé ? :) ^^
c'est soit fixed soit absolute Oo mais j'pense pas qu'absolute bouge Oo
--
RAPPEL : Html/Javascript -> Coté Client   ||   Php -> Coté Serveur
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Je ne comprend pas trop ce que tu me dis de faire.
Background-position ne prend pas "fixed" ou "absolute" en paramètres.
Et position seul, serait pour positionner mon div, lui est bien positionné.
0
Brachior Messages postés 613 Date d'inscription dimanche 21 octobre 2007 Statut Membre Dernière intervention 22 juin 2009 46
6 juin 2008 à 21:40
oui lol dsl ^^
alors euh moi c'que j'ai fais ( pour un panier sur un site )
j'ai mis une image de fond dans mon div et ai mis ce div en overflow
c'qui fait que l'image ne bouge pas

je ne sais pas si c'est ce que tu cherches =/

--
RAPPEL : Html/Javascript -> Coté Client   ||   Php -> Coté Serveur
0
Je cherche totalement l'inverse.
J'ai un div avec un défilement vertical, et j'aimerais que mon background suive le défilement.
0
Brachior Messages postés 613 Date d'inscription dimanche 21 octobre 2007 Statut Membre Dernière intervention 22 juin 2009 46
6 juin 2008 à 21:52
lol il est tard et j'comprend rien xD lol ^^
aurais tu un exemple ? :)
--
RAPPEL : Html/Javascript -> Coté Client   ||   Php -> Coté Serveur
0
Bah euh un exemple un exemple :/
Y'a rien de bien compliqué à comprendre ^^

Fais une page d'exemple chez toi.
du genre :

<body>
<div class="test">
<p>
Plein de truc...
</p>
<p>
Plein de truc...
</p>
.....
</div>
</body>

Tu spécifie une height à la classe CSS test, tu mets overflow en auto, et en blindant ton div de paragraphe, tu auras une barre de défilement verticale dans ce div.
Si tu mets une image d'arrière plan au ton div, tu verra qu'il reste fixe, il ne suit pas le défilement.

Et moi j'aimerais qu'il suive le défilement :)
0
https://developer.mozilla.org/fr/docs/CSS/background-attachment

ce que tu décris c'est background-attachment: local
mais c'est du CSS3 non pris en charge même par le dernier firefox.

Sinon, on peut faire ce que tu veux en mettant un div dans un autre:

<div style="overflow: auto;">
<div style="width: 100%; height: 100%; overflow: hidden; background-image: url(monimage.jpg); background-attachment: scroll;">

mon contenu

</div></div>
0