Discussion :

[Tarkna]

Bonjour.

Je suis en train de développer un site internet en html/css et je bloque sur le menu .

Il s'agit d'un menu horizontal avec des sous-catégories qui doivent apparaitre en transition lorsqu'on passe sur le bouton.

J'avais trouvé un code sympa en Jquery mais cependant le fond du bouton est le même que celui des sous-catégories ce qui ne me satisfait pas.



Pensez-vous avoir une idée pour résoudre mon problème ?



Je vous remercie.

[NoSmoking]

Bonsoir,
bien joli tout cela mais sans le moindre morceau de code je dirais qu'il te faut modifier le CSS des boutons lorsqu'ils sont hover, donc la class...mais bon!

[Tarkna]

Désolé pour l'oublie du code. :/

Le code html:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<div class="menuTransition">
        <ul>
                <li><a href="#">Langues</a></li>
                <li><a href="#">Comptabilité</a></li>
                <li><a href="#">Finance</a></li>
                <li><a href="#">Autres ressources</a></li>
        </ul>
</div>

Le code CSS:

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
.menuTransition a{
	background-image: url('images/menupx.png');
	font-family: Helvetica LT;
	font-size: 15px;
	font-weight: bold;
	color: #ffffff;
	text-shadow: #252634 0px 1px 2px;
	text-decoration:none;
	text-align: center;
	padding:30px;
    -webkit-transition: color .2s ease-in;
    -moz-transition: color .2s ease-in;
    -o-transition: color .2s ease-in;
    transition: color .2s ease-in;
}
.menuTransition a:hover{
    color:#fabfab;
}
ul
{
	padding-top:15px;
	list-style-type:none;
}
li
{
	 margin-left:2px;
	 float:left;
}

Il se fait que mon menu est tout en haut de la page et impossible de le déplacer et de fixer les bonnes dimensions.

De plus, il faudrait que j'y ajoute un menu déroulant avec un effet transition.

[NoSmoking]

Il te suffit de le placer avec les propriétés , margin, left, top... par rapport au conteneur. Le dimensionnement se fait à l'aide de width et height.

Pour l'effet de transition, si tu utilises jQuery, c'est bien le diable si il n'existe pas un plugin, les fonctions elles existent.

[Tarkna]

Il te suffit de le placer avec les propriétés , margin, left, top... par rapport au conteneur. Le dimensionnement se fait à l'aide de width et height.

Pour l'effet de transition, si tu utilises jQuery, c'est bien le diable si il n'existe pas un plugin, les fonctions elles existent.

J'ai déjà tout essayé pour les marges mais rien y fait. Pour le menu je n'ai rien trouvé qui permettait d'avoir une effet transition avec une image de fond différent à celui des boutons et du déroulant.

[NoSmoking]

as tu regardé ce qui ce faisait dans la galerie des menus

le changement d'image de fond se gère via les class que tu peux affecter sur les événements onmouseover et onmouseout