Menu CSS avec images différentesFermé

Question

Bonjour,

Voila je souhaiterai faire un menu horizontale, je vais essayez de vous expliquez mon idée accrochez vous ...

menu 1 (1er image sépia) passage de la souris (même image mais en couleur)
menu 2 (2eme image sépia) passage de la souris (même image mais en couleur)
...

Jusqu'à 5 menus

J'ai suivi plusieurs tutos, malheureusement ça ne fonctionne pas :x et le pire c'est que je ne comprends pas pourquoi. 

Mes images font 199 px (L) sur 147 px (H) c'est pour une page d'index.

Merci de votre coup de main

arthezius · Answer

Pourrai tu nous mettre le code de ton menu ?

Pour faire une image qui change au passage de la souris, il y a plusieurs manière de procéder.
En javascript ou en CSS.

Behmai · Answer

Voila

#conteneur{
	width:1O10 px;
	height:150 px;
	margin-left: 10 px;
	margin-right: 10 px;
	margin-top: 10px;
	margin-bottom:10px;
}

#navigation { 
    margin: 20 px ; 
    padding: 150px ; 
    list-style: none ; 
    text-align: center ; 
    }

#navigation li {  
    display:inline; 
    margin-right: 1px ;  
    } 
    
	
#navigation li a { 
    background:url(images/webdesign_01) left top no-repeat ; 
    font: 1em "Trebuchet MS",Arial,sans-serif ; 
    line-height: 1em ; 
    text-align: center ; 
    text-decoration: none ; 
    padding: 4px 0 ; 
    }
	
#navigation li a:hover, #navigation li a:focus, #navigation li a:active { 
    background: url(images/webdesign_02.jpg) left top no-repeat ; 
    }

arthezius · Answer

background:url(images/webdesign_01) left top no-repeat ;
Il manque l'extension à ton fichier image.

Tu devrai aussi remplacer:
#navigation li a {
par
#navigation li a:link {

Behmai · Answer

Oups pour l'extension (rougis)

Je vais faire ce que vous m'avez dis merci beaucoup

je vous re contacterai pour la suite

Behmai · Answer

Re bonjour, 

Rien ne fonctionne je m'arrache les cheveux lol. Même avec ce que vous m'avez suggérer plus haut.

J'ai suivi plusieurs tuto dont celui ci :

https://www.alsacreations.com/tuto/lire/574-Creer-des-menus-simples-en-CSS.html

Je ne sais même pas si ce que je souhaite faire est possible, ma prof de css m'a dis que oui, soit en pure css soit avec du javascript.

Je vous ai néanmoins fait une petite maquette avec explications en espérant trouver une solution.

http://img198.imageshack.us/img198/6715/maquetteu.jpg

Merci d'avance

Menu CSS avec images différentes

5 réponses

Discussions similaires

Newsletters