Modification image barre de navigation au passage de la souris

4 participants

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

Résolu Modification image barre de navigation au passage de la souris

Message par MlleAlys Dim 28 Oct 2012 - 18:17

Tout d'abord, je suis désolée si je ne poste pas dans la bonne section =S

Voilà, j'ai installé le code de ce tutoriel sur mon css (tout fonctionne très bien), et à la fin il est question de :
Narumi a écrit:Pour un remplacement immédiat sans temps de chargement ( la première fois ), vous pourriez avoir l'image et son remplacement sur la même "image" et utiliser la propriété background-position dans le CSS pour faire apparaître l'une ou l'autre.
J'ai bien compris le but, mais quelqu'un pourrait-il m'expliciter cela ? Je ne comprends ce qu'il faut faire exactement... ^^"

Merci d'avance ! Very Happy


Dernière édition par MlleAlys le Sam 3 Nov 2012 - 21:38, édité 3 fois
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

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

Résolu Re: Modification image barre de navigation au passage de la souris

Message par MlleAlys Lun 29 Oct 2012 - 18:22

up
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

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

Résolu Re: Modification image barre de navigation au passage de la souris

Message par MlleAlys Mar 30 Oct 2012 - 18:27

up
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

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

Résolu Re: Modification image barre de navigation au passage de la souris

Message par MlleAlys Mer 31 Oct 2012 - 23:06

up
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

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

Résolu Re: Modification image barre de navigation au passage de la souris

Message par MlleAlys Ven 2 Nov 2012 - 12:26

up
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

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

Résolu Re: Modification image barre de navigation au passage de la souris

Message par MlleAlys Sam 3 Nov 2012 - 15:09

up
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

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

Résolu Re: Modification image barre de navigation au passage de la souris

Message par loupbrave Sam 3 Nov 2012 - 16:34

Il faut 2 images par catégories:

Exemple: Pour le portail, il faut 1 image (qui sera affichée lorsqu'on est sur le forum) et 1 autre qui changera lorsqu'on passera dessus avec le pointeur de la souris.

Pour l'index ça donnerait par exemple:
Code:
/*IMAGE INDEX*/
        #i_icon_mini_index{
          background-image:url(http://i49.servimg.com/u/f49/17/69/03/92/forum_10.png); /*image si la souris ne survole pas*/
          width:100px; /*Largeur de l'image*/
          height:40px; /*Hauteur de l'image*/
        }
        #i_icon_mini_index:hover{
          background-image:url(http://i49.servimg.com/u/f49/17/69/03/92/forum_11.png); /*image si la souris survole*/
          width:100px; /*Largeur de l'image*/
          height:40px; /*Hauteur de l'image*/
        }

Tu change les adresses des url par les images que tu aura préparé, et pour chaque catégories, tu fais la même chose.

Au final, ça donne:

www.carpenoctem.wowjdr.com

Bon courage. Smile
avatar

loupbrave
Nouveau membre

Messages : 3
Inscrit(e) le : 03/09/2012

http://carpenoctem.wowjdr.com/
loupbrave a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification image barre de navigation au passage de la souris

Message par AenigmA Sam 3 Nov 2012 - 17:18

Bonsoir,
Ca marche avec deux images mais aussi avec une seule MlleAlys

Pour ta citation de Narumi, il parle d'une seule image de ce type :
Modification image barre de navigation au passage de la souris Accuei10
Qui contient les 2 sur une seule et que l'on positionne par le css.

La seule chose que tu as à choisir c'est une des deux solutions, ce que tu as fait.
AenigmA

AenigmA
Membre actif

Masculin
Messages : 2228
Inscrit(e) le : 10/03/2005

http://aenigma.forumactif.fr/
AenigmA a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification image barre de navigation au passage de la souris

Message par paolo18pp Sam 3 Nov 2012 - 17:52

Vous Pouvez utilisez sa
avatar

paolo18pp
***

Messages : 112
Inscrit(e) le : 19/05/2012

http://swagg.frbb.net/
paolo18pp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Modification image barre de navigation au passage de la souris

Message par MlleAlys Sam 3 Nov 2012 - 21:15

@AenigmA : aaaaah ! ok, je vois le principe maintenant !! :thanks:


(@loupbrave : oui merci, c'est déjà ce que j'ai fait avec le tuto =P Mais je vois sur ta page que tu as aussi le temps de chargement qui laisse un blanc, ce que je voulais résoudre ^^

@paolo18pp : merci, mais si j'ai bien compris, ça revient à ce que j'ai fait avec le tuto ^^)


Je passe le sujet en résolu !



EDIT : ça marche impec, merci encore !
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

MlleAlys 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