Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

AwesomeBB : Image du header fixe

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu AwesomeBB : Image du header fixe

Message par *Splash* Jeu 2 Aoû 2018 - 15:27

Hi,

Pour mon forum j'utilise l'image du header par défaut de la version :
https://2img.net/i/fa/awesomebb/header.png


Voici le header du forum :

AwesomeBB : Image du header fixe Header11

J'aimerais que cette image reste figée à l'écran et qu'au défilement de page on ait l'impression que c'est le forum qui la recouvre.
Si j'ajoute au code de ma CSS la fonction background-attachment: fixed; voici ce que donne le résultat à l'écran :

AwesomeBB : Image du header fixe Header12

L'image a la position fixe recherchée mais elle est comme agrandit

Voici mon code CSS :
Code:
/* Main menu */
#header-banner {
 background-image: url("https://2img.net/i/fa/awesomebb/header.png")
 background-attachment: fixed;
 height: 150px;
 margin-bottom: 20px;
 margin-left: 63px;
 border-radius: 0px 0px 10px 10px;
 width: 90%;
 box-shadow: 5px 10px 8px #888888;
 }


Que faut-il faire pour que l'image reste comme elle est sur le premier screen mais fixe à l'écran ?

Par avance merci


Dernière édition par *Splash* le Jeu 2 Aoû 2018 - 18:35, édité 1 fois
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3798
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: AwesomeBB : Image du header fixe

Message par ◦Jay◦ Jeu 2 Aoû 2018 - 18:02

Bonjour, essayez ceci :

Code:
/* Main menu */
#header-banner {
 background-image: url("https://2img.net/i/fa/awesomebb/header.png");
 background-size:90%;
 background-attachment: fixed;
 background-position:63px 20px;
 height: 150px;
 margin-bottom: 20px;
 margin-top:0;
 margin-left: 63px;
 border-radius: 0px 0px 10px 10px;
 width: 90%;
 box-shadow: 5px 10px 8px #888888;
 }
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

Voir le profil de l'utilisateur https://forum.forumactif.com
◦Jay◦ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: AwesomeBB : Image du header fixe

Message par *Splash* Jeu 2 Aoû 2018 - 18:22

Merci Jay, c'est OK ce code

Pour fixer la barre du haut :
AwesomeBB : Image du header fixe Sans_t39

Que faut-il modifier ?
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3798
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: AwesomeBB : Image du header fixe

Message par ◦Jay◦ Jeu 2 Aoû 2018 - 18:24

Comme ceci :

Code:
header{position:fixed;}
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

Voir le profil de l'utilisateur https://forum.forumactif.com
◦Jay◦ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: AwesomeBB : Image du header fixe

Message par *Splash* Jeu 2 Aoû 2018 - 18:27

Hum, non la barre ne reste pas fixe
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3798
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: AwesomeBB : Image du header fixe

Message par ◦Jay◦ Jeu 2 Aoû 2018 - 18:30

Si, cela fonctionne, essayez comme ceci :

Code:
header{position:fixed !important;}
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

Voir le profil de l'utilisateur https://forum.forumactif.com
◦Jay◦ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: AwesomeBB : Image du header fixe

Message par ◦Jay◦ Jeu 2 Aoû 2018 - 18:33

Vous avez déjà un code avec
Code:
header{position:relative;}
modifiez-le Wink
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

Voir le profil de l'utilisateur https://forum.forumactif.com
◦Jay◦ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: AwesomeBB : Image du header fixe

Message par *Splash* Jeu 2 Aoû 2018 - 18:34

@◦Jay◦ a écrit:Vous avez déjà un code avec
Code:
header{position:relative;}
modifiez-le Wink
Oui je viens de le modifier, au temps pour moi

Merci Jay
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3798
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: AwesomeBB : Image du header fixe

Message par ◦Jay◦ Jeu 2 Aoû 2018 - 18:35

De rien. Hi
◦Jay◦

◦Jay◦
Membre actif

Masculin
Messages : 4230
Inscrit(e) le : 24/12/2014

Voir le profil de l'utilisateur https://forum.forumactif.com
◦Jay◦ a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum