Sujet Précédent Sujet Suivant

Blocage prog site internet

Fermé
the-tibo - 4 août 2008 à 21:48
 the-tibo - 5 août 2008 à 14:02
Bonjour,

Je suis en train de faire un site internet et je suis ralentis par les menus déroulant. En effet j'ai crée un menu déroulant horizontal à l'aide d'un tutoriel javascript mais j'aimerai bien maintenant avoir des menus déroulant verticaux ( en plus des horizontaux bien sur) Jusqu'à présent je n'ai trouvé des codages soient pour l'un soient pour l'autre mais jamais pour les deux en m temps. Si quelqu'un pourrait me filait un coup de pouce car je suis bloqué de chez bloqué.

D'avance merci

PS: Voici mon codage si quelqu'un si connait (il s'agit du menu horizontal marchant très bien)

A quel moment rajouté le codage pour le menu vertical ???

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">

<head>

<title>Menu déroulant horizontal</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />



<script type="text/javascript">

<!--

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';}

}

//-->

</script>





<style type="text/css">



body {

margin: 0;

padding: 0;

background: white;

font: 80% verdana, arial, sans-serif;

}

dl, dt, dd, ul, li {

margin: 0;

padding: 0;

list-style-type: none;

}

#menu {

position: absolute;

top: 0;

left: 0;

z-index:100;

width: 100%;

}

#menu dl {

float: left;

width: 12em;

margin: 0 1px;

}

#menu dt {

cursor: pointer;

text-align: center;

font-weight: bold;

background: #ccc;

border: 1px solid gray;

}

#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 none;

}

#menu li a:hover, #menu dt a:hover {

background: #eee;

}



#site {

position: absolute;

z-index: 1;

top : 70px;

left : 10px;

color: #000;

background-color: #ddd;

padding: 5px;

border: 1px solid gray;

}



a {text-decoration: none;

color: black;

color: #222;

}

-->

</style>

</head>



<body>



<div id="menu">

<dl>

<dt onmouseover="javascript:montre();"><a href="" title="Retour à l'accueil">Accueil</a></dt>

</dl>



<dl>

<dt onmouseover="javascript:montre('smenu1');"><a href="" title="Retour à l'accueil">Nouveauté</a></dt>

</dl>





<dl>

<dt onmouseover="javascript:montre('smenu2');">Notre Showroom</dt>

<dd id="smenu2">

<ul>

<li><a href="RPB43#1.html">Rpb43</a></li>

<li><a href="MENDEUTIQUE48#1.html">Mendeutique48</a></li>

</ul>

</dd>

</dl>



<dl>

<dt onmouseover="javascript:montre('smenu3');">Nos Produits</dt>

<dd id="smenu3">



<ul>

<li><a href="Papier.html">Support Papier</a></li>

<li><a href="Consommables.html">Consommables</a></li>

<li><a href="Divers.html">Divers</a></li>

</ul>

</dd>

</dl>



<dl>

<dt onmouseover="javascript:montre('smenu4');">Nos Services</dt>

<dd id="smenu4">

<ul>

<li><a href="service.html">Service Client</a></li>

<li><a href="financement.html">Financement</a></li>

<li><a href="Environnement.html">Environnement</a></li>

</ul>

</dd>

</dl>



</div>



</body>

</html>
A voir également:

2 réponses

Réponse 1 / 2
the-tibo
5 août 2008 à 06:14
Personne n'a trouvé de réponse pour me dépanner...
0
Réponse 2 / 2
the-tibo
5 août 2008 à 14:02
quelqu'un connaitrai l'adresse d'un site ou on pourrait me dépanner concernant ce pbm?
0

Discussions similaires

C'est quoi le site qui remplace coco chat
TP3 -
bazfile -

2 réponses
35 GO à l'étranger
Laurence -
Laurence -

2 réponses