recodage d'un bouton de la navbar

4 participants

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

Résolu recodage d'un bouton de la navbar

Message par Mizar Sam 4 Juil 2015 - 12:48

Détails techniques


Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://passionfoveon.forumactif.org

Description du problème

bonjour
j'ai suivi un tuto pour le changement d'aspect des boutons au passage de la souris
tout est ok sauf pour un bouton que j'ai rajouté
j'ai mis le css suivant
Spoiler:
les dimensions fonctionnent et agissent sur le bouton
mais si je mets une image transparente au niveau de "entête et navigation", le bouton disparait
voici le css
Spoiler:
merci pour votre aide


Dernière édition par Mizar le Mer 15 Juil 2015 - 18:10, édité 1 fois
avatar

Mizar
***

Messages : 118
Inscrit(e) le : 19/06/2015

http://passionfoveon.forumactif.org
Mizar a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Arobasse Sam 4 Juil 2015 - 16:13

Hello Mizar,

Le mieux serait qu'on puisse copier et coller le code et n'ont qu'on le retape de l'image Razz

Aussi, il serait bon de savoir qu'elle bouton sur ton site ne fonctionne pas ?

Merci Smile
Arobasse

Arobasse
Nouveau membre

Messages : 20
Inscrit(e) le : 04/07/2015

https://forum.forumactif.com/
Arobasse a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Mizar Sam 4 Juil 2015 - 16:54

c'est le bouton forum Wink
ou je prourrais remettre le bouton accueil mais avec l'image "forum", mais je ne sais pas remettre "accueil" ...
avatar

Mizar
***

Messages : 118
Inscrit(e) le : 19/06/2015

http://passionfoveon.forumactif.org
Mizar a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Mizar Lun 6 Juil 2015 - 9:03

Arobasse a écrit:Hello Mizar,

Le mieux serait qu'on puisse copier et coller le code et n'ont qu'on le retape de l'image Razz

bonjour
je ne comprend pas ce que vous voulez dire?
j'ai copié collé le codage en changeant le mot "bidule" par "forum"
il s"agit du bouton "forum" que j'ai rajouté pour remplacer "accueil"
merci
avatar

Mizar
***

Messages : 118
Inscrit(e) le : 19/06/2015

http://passionfoveon.forumactif.org
Mizar a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Arobasse Mar 7 Juil 2015 - 2:05

Tu fournis le CSS dans une image, si tu pourrais copier/coller le code entre les balise suivante, cela serait géniale Very Happy!

Code:
[code][/code]
Arobasse

Arobasse
Nouveau membre

Messages : 20
Inscrit(e) le : 04/07/2015

https://forum.forumactif.com/
Arobasse a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Mizar Mar 7 Juil 2015 - 9:14

Ça y est j'ai compris geek
Code:
 }
        .forum {
        background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button26.png"class="forum'); /*image si la souris ne survole pas*/
        width: 80px; /*Largeur de l'image*/
        height: 28px; /*Hauteur de l'image*/
        }
        .forum:hover{
        background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button52.png"class="forum'); /*image si la souris survole*/
        width: 80px; /*Largeur de l'image*/
        height: 28px; /*Hauteur de l'image*/
        }
avatar

Mizar
***

Messages : 118
Inscrit(e) le : 19/06/2015

http://passionfoveon.forumactif.org
Mizar a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Mizar Jeu 9 Juil 2015 - 17:15

Up svp
avatar

Mizar
***

Messages : 118
Inscrit(e) le : 19/06/2015

http://passionfoveon.forumactif.org
Mizar a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par demeter1 Jeu 9 Juil 2015 - 18:14

Tu t'es trompé de class, il faut mettre mainmenu au lieu de forum
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Mizar Sam 11 Juil 2015 - 12:42

bonjour
j'ai remplacé le mot forum par mainmenu dans le sript css, mais ça ne change rien
Code:
  .forum{
        background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button26.png"class="mainmenu'); /*image si la souris ne survole pas*/
        width: 80px; /*Largeur de l'image*/
        height: 28px; /*Hauteur de l'image*/
        }
        .forum:hover{
        background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button52.png"class="mainmenu'); /*image si la souris survole*/
        width: 80px; /*Largeur de l'image*/
        height: 28px; /*Hauteur de l'image*/
        }
avatar

Mizar
***

Messages : 118
Inscrit(e) le : 19/06/2015

http://passionfoveon.forumactif.org
Mizar a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par no_way Dim 12 Juil 2015 - 7:24

Bonjour, remplacez:
Code:
          .forum{
                background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button26.png"class="mainmenu'); /*image si la souris ne survole pas*/
                width: 80px; /*Largeur de l'image*/
                height: 28px; /*Hauteur de l'image*/
                }
                .forum:hover{
                background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button52.png"class="mainmenu'); /*image si la souris survole*/
                width: 80px; /*Largeur de l'image*/
                height: 28px; /*Hauteur de l'image*/
                }
par:
Code:
.mainmenu .forum{
/*image si la souris ne survole pas*/
background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button26.png');
width: 80px; /*Largeur de l'image*/
height: 28px; /*Hauteur de l'image*/
}
.mainmenu .forum:hover{
/*image si la souris survole*/
background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button52.png');
}

Notez que votre image choisie pour le survol est certes un png mais n'a pas de transparence (contour blanc), ce n'est pas un souci de codage.
no_way

no_way
Membre actif

Messages : 2214
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Mizar Lun 13 Juil 2015 - 10:36

merci
il y a du mieux mais ce n'est pas encore ça
le bouton qui devrait monter au passage de la souris reste dessous
j'ai fait différents test d"images et sur certaines je vois un cadre déborder, sur celle que j'ai mise avec une tipo rouge n'apparait pas

Code:
 .mainmenu .forum{
        /*image si la souris ne survole pas*/
        background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button26.png');
        width: 80px; /*Largeur de l'image*/
        height: 28px; /*Hauteur de l'image*/
        }
        .mainmenu .forum:hover{
        /*image si la souris survole*/
        background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button49.png');
        }
avatar

Mizar
***

Messages : 118
Inscrit(e) le : 19/06/2015

http://passionfoveon.forumactif.org
Mizar a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Mizar Mar 14 Juil 2015 - 15:04

up svp
merci
avatar

Mizar
***

Messages : 118
Inscrit(e) le : 19/06/2015

http://passionfoveon.forumactif.org
Mizar a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par no_way Mar 14 Juil 2015 - 15:20

Vous avez fait une erreur en éditant votre barre de navigation pour le bouton "forum" en mettant en image:
Code:
http://i18.servimg.com/u/f18/15/75/86/05/button26.png
qui est votre bouton au lieu d'une image vide, mettez à la place:
Code:
http://2img.net/i/fa/empty.gif
no_way

no_way
Membre actif

Messages : 2214
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Mizar Mar 14 Juil 2015 - 19:08

merci
j'ai mis le code "empty" que vous m'avez envoyé, mais du coup le bouton "forum" disparait
j'ai donc remis une image .. en attendant mieux Wink
avatar

Mizar
***

Messages : 118
Inscrit(e) le : 19/06/2015

http://passionfoveon.forumactif.org
Mizar a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par no_way Mer 15 Juil 2015 - 7:24

Je vois le souci, vous avez mis 2 fois le bouton pour accéder à votre forum, le deuxième est invisible car vous aviez bien choisi l'image vide (à laisser tel quel).

Supprimez le premier bouton, celui qui a pour lien /forum et qui dispose de la petite croix rouge pour le supprimer.

Je ne trouve pas de classe forum et vous n'en avez pas besoin, remplacez le CSS précédent par celui qui suit pour faire apparaître le bon bouton:
Code:
#i_icon_mini_index{
/*image si la souris ne survole pas*/
background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button26.png');
width: 80px; /*Largeur de l'image*/
height: 28px; /*Hauteur de l'image*/
}
#i_icon_mini_index:hover{
/*image si la souris survole*/
background-image: url('http://i18.servimg.com/u/f18/15/75/86/05/button49.png');
}
no_way

no_way
Membre actif

Messages : 2214
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: recodage d'un bouton de la navbar

Message par Mizar Mer 15 Juil 2015 - 18:09

cheers super ça marche
merci victoire
avatar

Mizar
***

Messages : 118
Inscrit(e) le : 19/06/2015

http://passionfoveon.forumactif.org
Mizar a été remercié(e) par l'auteur de ce sujet.

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

- Sujets similaires

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