OnMouseOut liste déroulante
badziz
Messages postés
62
Date d'inscription
jeudi 11 mai 2006
Statut
Membre
Dernière intervention
28 juin 2011
-
8 avril 2008 à 09:46
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 - 8 avril 2008 à 12:55
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 - 8 avril 2008 à 12:55
A voir également:
- OnMouseOut liste déroulante
- Java liste ✓ - Forum Java
- Liste marque de voiture excel - Forum PHP
- Input liste déroulante ✓ - Forum Javascript / DHTML
- Alimenter une liste déroulante vba - Forum VB.NET
- Liste déroulante php - Forum PHP
6 réponses
nicomilville
Messages postés
3472
Date d'inscription
lundi 16 juillet 2007
Statut
Membre
Dernière intervention
28 février 2014
36
8 avril 2008 à 09:59
8 avril 2008 à 09:59
Salut,
peus tu nous préciser ce que sont tes sous menu, es ce des divs ???
Si t'a besoin d'aide, MP !!!
peus tu nous préciser ce que sont tes sous menu, es ce des divs ???
Si t'a besoin d'aide, MP !!!
cs_bultez
Messages postés
13615
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
30
8 avril 2008 à 10:04
8 avril 2008 à 10:04
Bonjour,
>>lorsque le curseur quitte la liste des sous catégories, les sous-catégories restent affichées
ben non... ni avec K-Meleon, ni avec IE(7)... ????
tu utilises quel navigateur ?
>>de faire un onMouseOut
euh... pas regarder l'exemple, mais à mon huble avsi, tout est fait en CSS,
pourquoi vouloir ajouter du javascript ? ( inutile )
<hr /> Cordialement Bul
>>lorsque le curseur quitte la liste des sous catégories, les sous-catégories restent affichées
ben non... ni avec K-Meleon, ni avec IE(7)... ????
tu utilises quel navigateur ?
>>de faire un onMouseOut
euh... pas regarder l'exemple, mais à mon huble avsi, tout est fait en CSS,
pourquoi vouloir ajouter du javascript ? ( inutile )
<hr /> Cordialement Bul
badziz
Messages postés
62
Date d'inscription
jeudi 11 mai 2006
Statut
Membre
Dernière intervention
28 juin 2011
1
8 avril 2008 à 10:26
8 avril 2008 à 10:26
Sur le tutoriel oui il n'y a pas de problèmes les sous-menus s'effacent automatiquement mais dans ma création non. Je ne vois pas trop pourquoi. Voila une portion du code HTML:
Pas de changements particulier par rapport au tuto.
Pour le javascript, c'est identique. Et pour le CSS, voila mon code:
Je vois rien de spécial...
<td colspan="2"> [index.php ] </td> <td colspan="6"> * : <li>Actus de la semaine</li> <li>Actus mois précédent</li> </td>
Pas de changements particulier par rapport au tuto.
Pour le javascript, c'est identique. Et pour le CSS, voila mon code:
dl, dt, dd, ul, li {
margin: 0px;
padding: 0px;
list-style-type: none;
}
#menu {
position: absolute;
width: 829px;
vertical-align: top;
float: left;
}
#menu dl
{
float: left;
margin: 0 0;
margin-bottom: 26px;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
border: 0px solid gray;
display: inherit;
}
#menu dd {
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0;
display: block;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}
Je vois rien de spécial...
cs_bultez
Messages postés
13615
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
30
8 avril 2008 à 10:44
8 avril 2008 à 10:44
Bonjour,
>>Pas de changements particulier par rapport au tuto.
particulier, certes... mais il y en a ! puisque le tuto fonctione et pas ce que tu fais
>>Pour le javascript, c'est identique.
ah... y'a du javascript quand même ?
pas sûr que cela soit nécessaire !
>>Je vois rien de spécial...
et pourtant, çà ne fonctionne pas....
revérifie méticuleusement.
tiens en voici un autre....sans js.
à toit d'adapter à ce que tu veux.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head>
<style type="text/css">
ul.menu { list-style-type: none;
margin : 0;
padding: 0; }
ul.menu li { float: left;
margin: 0;
border: 0; }
ul.menu ul { position: absolute;
display: none;
list-style-type: none;
margin: 0;
padding: 0;
border: solid 1px black; }
ul.menu ul li { float: none;
padding: 0; }
ul.menu li a:link, ul.menu li a:visited
{ display: block;
color: #800000;
background: #FFFFAA;
margin: 0;
padding: 4px 4px;
text-decoration: none; }
ul.menu li a:hover
{ background: #AAAAFF; }
ul.menu li:hover > ul
{ display: block; }
</style>
</head>
<li>[# Niveau 1]
<li>[# Niveau 1.1]</li>
<li>[# Niveau 1.2]</li>
<li>[# Niveau 1.3]</li>
</li>
<li>[# Niveau 2]
<li>[# Niveau 2.1]</li>
<li>[# Niveau 2.2]</li>
<li>[# Niveau 2.3]</li>
</li>
</html>
<hr /> Cordialement Bul
>>Pas de changements particulier par rapport au tuto.
particulier, certes... mais il y en a ! puisque le tuto fonctione et pas ce que tu fais
>>Pour le javascript, c'est identique.
ah... y'a du javascript quand même ?
pas sûr que cela soit nécessaire !
>>Je vois rien de spécial...
et pourtant, çà ne fonctionne pas....
revérifie méticuleusement.
tiens en voici un autre....sans js.
à toit d'adapter à ce que tu veux.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head>
<style type="text/css">
ul.menu { list-style-type: none;
margin : 0;
padding: 0; }
ul.menu li { float: left;
margin: 0;
border: 0; }
ul.menu ul { position: absolute;
display: none;
list-style-type: none;
margin: 0;
padding: 0;
border: solid 1px black; }
ul.menu ul li { float: none;
padding: 0; }
ul.menu li a:link, ul.menu li a:visited
{ display: block;
color: #800000;
background: #FFFFAA;
margin: 0;
padding: 4px 4px;
text-decoration: none; }
ul.menu li a:hover
{ background: #AAAAFF; }
ul.menu li:hover > ul
{ display: block; }
</style>
</head>
<li>[# Niveau 1]
<li>[# Niveau 1.1]</li>
<li>[# Niveau 1.2]</li>
<li>[# Niveau 1.3]</li>
</li>
<li>[# Niveau 2]
<li>[# Niveau 2.1]</li>
<li>[# Niveau 2.2]</li>
<li>[# Niveau 2.3]</li>
</li>
</html>
<hr /> Cordialement Bul
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
badziz
Messages postés
62
Date d'inscription
jeudi 11 mai 2006
Statut
Membre
Dernière intervention
28 juin 2011
1
8 avril 2008 à 11:44
8 avril 2008 à 11:44
Chez moi ca fonctionne, c'est surement le fait que je n'ai fournit qu'une partie du html...
pour le javascript oui regarde sur le lien, il y en a:
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
Je vais tester ce que tu m'as donné merci ;-)
pour le javascript oui regarde sur le lien, il y en a:
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
Je vais tester ce que tu m'as donné merci ;-)
cs_bultez
Messages postés
13615
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
30
8 avril 2008 à 12:55
8 avril 2008 à 12:55
>>
Chez moi ca fonctionne
??? je ne comprend plus ? ça fonctionne ou pas ?
et si tu peux éviter le javascript.... n'hésite pas !
certains refusent d'utiliser le javascript ( et plus nombreux que ceux qui
utilisent un navigateur alternatif que je ne citerais pas... par exemple ! )
<hr /> Cordialement Bul
Chez moi ca fonctionne
??? je ne comprend plus ? ça fonctionne ou pas ?
et si tu peux éviter le javascript.... n'hésite pas !
certains refusent d'utiliser le javascript ( et plus nombreux que ceux qui
utilisent un navigateur alternatif que je ne citerais pas... par exemple ! )
<hr /> Cordialement Bul