Background de site fixe quand le reste bouge
Résolu
alexou1984
Messages postés
375
Date d'inscription
Statut
Membre
Dernière intervention
-
kucie -
kucie -
Bonjour,
J'ai vu sur un site quelque chose d'assez étonnant. Lorsqu'il y a des ascensseurs, les éléments bougent à l'aide de la souris mais le background (l'image de fond) lui reste complètement fixe, il ne se déplace pas avec le reste des éléments. Comment fait-on cela ? Si possible en CSS...
Merci d'avance.
J'ai vu sur un site quelque chose d'assez étonnant. Lorsqu'il y a des ascensseurs, les éléments bougent à l'aide de la souris mais le background (l'image de fond) lui reste complètement fixe, il ne se déplace pas avec le reste des éléments. Comment fait-on cela ? Si possible en CSS...
Merci d'avance.
A voir également:
- Gvrbackgroundwindow3
- Site de telechargement - Accueil - Outils
- Site comme coco - Accueil - Réseaux sociaux
- Quel site remplace coco - Accueil - Réseaux sociaux
- Site de partage de photos - Guide
- Site x - Guide
5 réponses
Bonjour,
Pour que le background reste fixe pendant que tu joue avec les "ascenseurs" (tu scrolles) , il y a une propriété css pour ça ...
dès le début de ton css , il doit y avoir ça :
body
{
width: 790px;
margin: auto;
background-image: url("images/bg.gif");
background-attachment: fixed; /* <-- C'est cette propriété qui te sers à figer le fond !*/
font-family: "Times New Roman", Georgia, Arial, serif;
}
Les autres propriétés sont facultatives mais elles rendent service :
width: 790px , c'est pour que les utilisateurs avec une faible résolution d'écran aient un site correct
margin: auto , ça te sert à centrer ton site
background-image , tu l'as compris : c'est le chemin vers l'image du fond de ton site
font-family , c'est la liste de polices utilisées pour le site (on commence par la première)
Voilou , j'espère que j'ai répondu à ta question :=)
A peluche !
Pour que le background reste fixe pendant que tu joue avec les "ascenseurs" (tu scrolles) , il y a une propriété css pour ça ...
dès le début de ton css , il doit y avoir ça :
body
{
width: 790px;
margin: auto;
background-image: url("images/bg.gif");
background-attachment: fixed; /* <-- C'est cette propriété qui te sers à figer le fond !*/
font-family: "Times New Roman", Georgia, Arial, serif;
}
Les autres propriétés sont facultatives mais elles rendent service :
width: 790px , c'est pour que les utilisateurs avec une faible résolution d'écran aient un site correct
margin: auto , ça te sert à centrer ton site
background-image , tu l'as compris : c'est le chemin vers l'image du fond de ton site
font-family , c'est la liste de polices utilisées pour le site (on commence par la première)
Voilou , j'espère que j'ai répondu à ta question :=)
A peluche !
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Voilà j'ai fini un site et j'ai ce problème, j'ai mis comme tu dis au dessus, dans body:auto;
mais je remarque que qd je clique sur les pages différentes il y a un décalage, surtout sur les pages plus longues.
J'ai essayé de mettre alors une marge à gauche dans body et là je n'ai plus de problème mais ce n'est pas la solution.
Comment faire?
Merci