Nouveau bouton de navigation et survol ?

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

Résolu Nouveau bouton de navigation et survol ?

Message par Tyma le Mar 23 Fév 2010 - 16:55

Bonjour, voilà je viens vous exposer le problème que je rencontre Smile.

Il y a quelques temps j'ai suivi les instructions d'un des tutoriels officiels de FA pour ajouter le changement des images de la barre de navigation quand la souris passe dessus. Pour le moment tout va bien.

Il y a quelques minutes, j'ai voulu ajouter un nouveau bouton personnalisé dans cette barre de navigation. L'image de ce bouton s'affiche comme il faut.


Le problème est le suivant :

Quand la souris passe sur ce nouveau bouton, cela ne fait rien (c'est bien normal comme c'est une image seul). C'est pour cela que j'aurais aimé savoir comment faire pour que l'image de ce nouveau bouton change comme les autres au passage de la souris ?


Merci de votre attention Smile.


Dernière édition par Tyma le Mer 24 Fév 2010 - 16:53, édité 1 fois

Tyma
****

Masculin
Messages : 272
Inscrit(e) le : 13/10/2009

http://www.clic-clac-forum.com
Tyma a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Nouveau bouton de navigation et survol ?

Message par Invité le Mer 24 Fév 2010 - 6:51

Bonjour,

C'est une autre histoire, en effet (me demande pourquoi le tuto ne comprend pas cette partie-là ?)

La deuxième partie de ce post (à partir de "Pour les boutons personnalisés (menus personnalisés)") répondrait certainement à ta question...

Invité
Invité


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

Résolu Re: Nouveau bouton de navigation et survol ?

Message par Tyma le Mer 24 Fév 2010 - 13:38

Bonjour, merci pour la réponse Smile.

Je viens de parcourir le post en question, j'ai bien compris ce qu'il fallait ajouter à l'adresse de l'image. Mais quand est-il du CSS ?

Je ne sais pas trop comment le lire :
Dans le CSS on lui donne les même propriétés qu'aux autres icônes ainsi :
.bidule {position: absolute; top: YYYpx; left: XXXpx;
}

Je ne comprend pas trop ce CSS que je dois utilisé ?
Je ne vois pas ou sera ajouté la deuxième image pour le survol ?

Merci bien Smile.

Tyma
****

Masculin
Messages : 272
Inscrit(e) le : 13/10/2009

http://www.clic-clac-forum.com
Tyma a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Nouveau bouton de navigation et survol ?

Message par Invité le Mer 24 Fév 2010 - 16:03

Woups, sorry, oui il n'était pas complet, mais voilà qui est fait.

Pour les boutons personnalisés (menus personnalisés) le tuto est un peu plus complexe :
  • Tout d'abord dans le PA >> Affichage >> Entête & Navigation > tableau de la barre de navigation
  • Il faut donner un attribut class à l'image en allant sur edit du menu.
  • A la fin de l'adresse de l'image il faut ajouter un guillemet, par exemple : .png"
  • Un espace et class="bidule ce qui donne :
    http://url_image.png" class="bidule
    qui sera généré par les variables comme il se doit :
    <img src="url_image.png" class="bidule" />

  • Dans le CSS on lui donne les même propriétés qu'aux autres icônes ainsi :
    .bidule {
    background-image: url('URL'); /*image si la souris ne survole pas*/
    width: ??px; /*Largeur de l'image*/
    height: ??px; /*Hauteur de l'image*/
    }
    .bidule:hover{
    background-image: url('URL'); /*image si la souris survole*/
    width: ??px; /*Largeur de l'image*/
    height: ??px; /*Hauteur de l'image*/
    }
  • Mais attention, il faudra à chaque fois qu'une image sera modifiée à cet endroit du PA, remettre l'url image et son class comme précédemment expliqué.

Ne pas oublier que ce n'est pas au point l'histoire et que c'est un beugant.

Invité
Invité


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

Résolu Re: Nouveau bouton de navigation et survol ?

Message par Tyma le Mer 24 Fév 2010 - 16:31

C'est rien Smile.

Par contre, je viens d'ajouter ce CSS, en remplacent les informations par rapport a mes deux images (que ce soit les liens vers les deux images ainsi que leur taille) mais en validant cela ne fonctionne pas correctement.

Au survol de la souri, l'image ne change pas, le noir de l'image s'accentue très faiblement, presque pas, mais elle ne se remplace pas par la deuxième image ? Il ne manque rien de plus au CSS ?

Merci bien Smile

Tyma
****

Masculin
Messages : 272
Inscrit(e) le : 13/10/2009

http://www.clic-clac-forum.com
Tyma a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Nouveau bouton de navigation et survol ?

Message par Invité le Mer 24 Fév 2010 - 16:46

Sur l'autre tuto de Narumi, il est bien dit qu'il faut remplacer l'image de ton menu par une image transparente (vide) qui est : http://illiweb.com/fa/empty.gif" class="bidule
Les images des boutons sont en background dans le CSS.

As-tu procédé ainsi ?

Invité
Invité


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

Résolu Re: Nouveau bouton de navigation et survol ?

Message par Tyma le Mer 24 Fév 2010 - 16:53

Évidement, que je suis bête. J'avais bien intégré le " class="bidule, mais derrière mon image, il manquais donc d'ajouter une image vide (transparente).

Je viens de modifié cela à l'instant, et je suis heureux d'annoncer que cela marche très bien Smile.

Donc je te remercie pour l'aide précieuse que tu m'as apporté merci et je vais éditer le premier sujet pour le résolu.

Je te souhaite de passer une bonne journée Smile.

Tyma
****

Masculin
Messages : 272
Inscrit(e) le : 13/10/2009

http://www.clic-clac-forum.com
Tyma a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Nouveau bouton de navigation et survol ?

Message par Invité le Mer 24 Fév 2010 - 16:59

Mais je t'en prie. Wink

Invité
Invité


Invité 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