Problème menu java script
jjaco
Messages postés
575
Statut
Membre
-
jjaco Messages postés 575 Statut Membre -
jjaco Messages postés 575 Statut Membre -
Bonjour,
j'ai d'abord un css qui fonctionne
ensuite un script dans head:
<script type="text/javascript">
/*
Created by: Travis Beckham :: http://travisbeckham.com | http://travisbeckham.com/
version date: 06/02/03 :: If want to use this code, feel free to do so,
but please leave this message intact. (Travis Beckham)
*/
// Node Functions...
/*je passe sauf si vous me le demander*/
// Menu Functions & Properties
var activeMenu = null;
function showMenu() {
if(activeMenu){
activeMenu.className = "";
getNextSiblingByElement(activeMenu).style.display = "none";
}
if(this == activeMenu){
activeMenu = null;
} else {
this.className = "active";
getNextSiblingByElement(this).style.display = "block";
activeMenu = this;
}
return false;
}
function initMenu(){
var menus, menu, text, a, i;
menus = getChildrenByElement(document.getElementById("menu"));
for(i = 0; i < menus.length; i++){
menu = menus[i];
text = getFirstChildByText(menu);
a = document.createElement("a");
menu.replaceChild(a, text);
a.appendChild(text);
a.href = "#";
a.onclick = showMenu;
a.onfocus = function(){this.blur()};
}
}
if(document.createElement) window.onload = initMenu;
</script>
</head>
et ma liste dans body
<body>......
<div class="menu"> <font size="5"> <strong> Nos Produits<br>
<ul id="menu">
<li>salle de bain
<ul type=>
<li><a href="#">robinets</a></li>
<li><a href="#">syphons</a></li>
<li><a href="#">éviers</a></li>
<li><a href="#">douches</a></li>
<li><a href="#">baignoires</a></li>
</ul>
</li>
<li>cuisine
<ul>
<li><a href="#">robinets</a></li>
<li><a href="#">syphons</a></li>
<li><a href="#">éviers</a></li>
</ul>
</li>
</ul>
.... </div></body></html>
Tout fonctionne, sauf:
lorsque j'ouvre ma page du site, je reçois
les listes complètes ouvertes et pour les fermer je dois double cliquer sur le sujet pour que la liste se ferme
exemple je recois
salle de bain: je dois double clic sur salle de bain pour enlever la liste
- évier
- baignoire
- douche
- syphon
- etc...
cuisine: et je dois double clic sur cuisine pour enlever la liste
- evier
- robinet
- etc...
pour finalement avoir
salle de bain
cuisine
sur les quels je peux double cliquer pour ouvrir
merci de votre aide
jjaco
j'ai d'abord un css qui fonctionne
ensuite un script dans head:
<script type="text/javascript">
/*
Created by: Travis Beckham :: http://travisbeckham.com | http://travisbeckham.com/
version date: 06/02/03 :: If want to use this code, feel free to do so,
but please leave this message intact. (Travis Beckham)
*/
// Node Functions...
/*je passe sauf si vous me le demander*/
// Menu Functions & Properties
var activeMenu = null;
function showMenu() {
if(activeMenu){
activeMenu.className = "";
getNextSiblingByElement(activeMenu).style.display = "none";
}
if(this == activeMenu){
activeMenu = null;
} else {
this.className = "active";
getNextSiblingByElement(this).style.display = "block";
activeMenu = this;
}
return false;
}
function initMenu(){
var menus, menu, text, a, i;
menus = getChildrenByElement(document.getElementById("menu"));
for(i = 0; i < menus.length; i++){
menu = menus[i];
text = getFirstChildByText(menu);
a = document.createElement("a");
menu.replaceChild(a, text);
a.appendChild(text);
a.href = "#";
a.onclick = showMenu;
a.onfocus = function(){this.blur()};
}
}
if(document.createElement) window.onload = initMenu;
</script>
</head>
et ma liste dans body
<body>......
<div class="menu"> <font size="5"> <strong> Nos Produits<br>
<ul id="menu">
<li>salle de bain
<ul type=>
<li><a href="#">robinets</a></li>
<li><a href="#">syphons</a></li>
<li><a href="#">éviers</a></li>
<li><a href="#">douches</a></li>
<li><a href="#">baignoires</a></li>
</ul>
</li>
<li>cuisine
<ul>
<li><a href="#">robinets</a></li>
<li><a href="#">syphons</a></li>
<li><a href="#">éviers</a></li>
</ul>
</li>
</ul>
.... </div></body></html>
Tout fonctionne, sauf:
lorsque j'ouvre ma page du site, je reçois
les listes complètes ouvertes et pour les fermer je dois double cliquer sur le sujet pour que la liste se ferme
exemple je recois
salle de bain: je dois double clic sur salle de bain pour enlever la liste
- évier
- baignoire
- douche
- syphon
- etc...
cuisine: et je dois double clic sur cuisine pour enlever la liste
- evier
- robinet
- etc...
pour finalement avoir
salle de bain
cuisine
sur les quels je peux double cliquer pour ouvrir
merci de votre aide
jjaco
A voir également:
- Problème menu java script
- Jeux java itel - Télécharger - Jeux vidéo
- Waptrick java football - Télécharger - Jeux vidéo
- Waptrick java voiture - Télécharger - Jeux vidéo
- Menu déroulant excel - Guide
- Java apk - Télécharger - Langages
1 réponse
c'est pas résolu tout a fait, mais le problème ne vient pas du script, il vient de la liste et du css
dans le css il y a plein de ul # ol #li,
.menu /*bloc menu*/
{
height:725px;
width:180px;
float:left;
overflow:scroll;
}
ul#menu /*configuration de la liste*/
{
width:180px;
list-style-type: none;
border-top: solid 1px #ffffff;
background-color:blue;
margin-left:0px;
margin-top:0px;
padding: 5px;
}
ul#menu ol /*en suppimant on change la couleur et la taille des textes*/
{
display:none;
text-align:left;
list-style-type:none;
margin:0;
padding:2px;
}
ul#menu li, /*attributs des éléments des listes*/
ul#menu a
{
font-family:verdana, sans-serif;
font-size:12px;
color: yellow;
padding-left:1px;
}
ul#menu li
{
/*border-bottom: solid 2px #ffffff; *//* ligne de separatides éléments de la liste*/
line-height: 25px;
}
ul#menu ol li
{
border-bottom: none;
}
ul#menu ol li:before
{
content: "- ";
}
ul#menu a
{
text-decoration: none;
outline: none;
}
ul#menu a:hover /*couleur texte au survol de la souris*/
{
color:red;
}
ul#menu a.active /*couleur du menu ouvert*/
{
color:red;
}
j'y arriverai, dussai-je y passer des nuits blanches!
c'est dans ma liste que je dois piocher?
bonne soiree bonne semaine
dans le css il y a plein de ul # ol #li,
.menu /*bloc menu*/
{
height:725px;
width:180px;
float:left;
overflow:scroll;
}
ul#menu /*configuration de la liste*/
{
width:180px;
list-style-type: none;
border-top: solid 1px #ffffff;
background-color:blue;
margin-left:0px;
margin-top:0px;
padding: 5px;
}
ul#menu ol /*en suppimant on change la couleur et la taille des textes*/
{
display:none;
text-align:left;
list-style-type:none;
margin:0;
padding:2px;
}
ul#menu li, /*attributs des éléments des listes*/
ul#menu a
{
font-family:verdana, sans-serif;
font-size:12px;
color: yellow;
padding-left:1px;
}
ul#menu li
{
/*border-bottom: solid 2px #ffffff; *//* ligne de separatides éléments de la liste*/
line-height: 25px;
}
ul#menu ol li
{
border-bottom: none;
}
ul#menu ol li:before
{
content: "- ";
}
ul#menu a
{
text-decoration: none;
outline: none;
}
ul#menu a:hover /*couleur texte au survol de la souris*/
{
color:red;
}
ul#menu a.active /*couleur du menu ouvert*/
{
color:red;
}
j'y arriverai, dussai-je y passer des nuits blanches!
c'est dans ma liste que je dois piocher?
bonne soiree bonne semaine