recodage d'un bouton de la navbar

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 le 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:
http://i18.servimg.com/u/f18/15/75/86/05/captur13.jpg
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:
http://i18.servimg.com/u/f18/15/75/86/05/captur15.jpg
merci pour votre aide


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

Mizar
**

Messages : 89
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 le 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
Nouveau membre

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

http://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 le 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" ...

Mizar
**

Messages : 89
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 le 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

Mizar
**

Messages : 89
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 le 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
Nouveau membre

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

http://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 le 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*/
        }

Mizar
**

Messages : 89
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 le Jeu 9 Juil 2015 - 17:15

Up svp

Mizar
**

Messages : 89
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 le Jeu 9 Juil 2015 - 18:14

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

demeter1
+ Hyperactif +

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

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

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

Message par Mizar le 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*/
        }

Mizar
**

Messages : 89
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 le 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
Aidactif
Aidactif

Messages : 1739
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 le 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');
        }

Mizar
**

Messages : 89
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 le Mar 14 Juil 2015 - 15:04

up svp
merci

Mizar
**

Messages : 89
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 le 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://illiweb.com/fa/empty.gif

no_way
Aidactif
Aidactif

Messages : 1739
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 le 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

Mizar
**

Messages : 89
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 le 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
Aidactif
Aidactif

Messages : 1739
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 le Mer 15 Juil 2015 - 18:09

cheers super ça marche
merci victoire

Mizar
**

Messages : 89
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


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