menu vertical CSS javascript

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : menu vertical CSS javascript

elti69

bonjour,
j'ai utiliser le tutoriel du site alsacreation pour creer un menu vertical. (la variante)
http://css.alsacreations.com/Const [...] horizontal

j'ai 2 rendus differents 1 sous IE et 1 sous FF.

mouseover sur le club sous IE

mouseover sur le club sous FF

j'aimerais que le rendu soit celui de FF sur tout les navigateurs.

voici mes ligne de codes.
CSS
ul {
margin: 0;
margin-bottom: 10px;
padding: 0;
list-style-image: url("../images/foot.gif" );
}

li {
margin: 0;
margin-left: 20px;
margin-top: 4px;
padding: 0;
}

#menu {
width:168px;
float:left;
height:602px;
}

#menu dt {
cursor: pointer;
background: #fff;
height: 20px;
line-height: 20px;
margin: 2px;
border: 1px solid gray;
text-align: center;
font-weight: bold;
}

#menu dd {
position: absolute;
left: 120px;
margin-top: -14px;
width: 140px;
background: #fff;
border: 1px dashed gray;
}

#menu ul {
padding: 2px;
background:0;
list-style-image: url("../images/foot.gif" );
}

#menu li {
font-size: 10px;
height: 18px;
line-height: 18px;
background:0;
}

#menu li a, #menu dt a {
color: #000;
text-decoration: none;
background-color:#fff;
background:0;
}

#menu li a:hover {
color:#fce017;
background-color:#000;
text-decoration: underline;
}

PAGE HTML
<?php
include 'includes/menu.js';
?>
<dl>
<dt onmouseover="javascript:montre();"><a href="" title="Retour à l'accueil">Accueil</a></dt>
</dl>

<dl>
<dt onmouseover="javascript:montre('smenu1');">Le Club</dt>

<dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre('');">
<ul>
<li><a href="club.php">Le Club</a></li>
<li><a href="ecoledefoot.php">L'école de foot</a></li>
<li><a href="debutants.php">Les Débutants</a></li>
<li><a href="poussins.php">Les poussins</a></li>
<li><a href="benjamins.php">Les Benjamins</a></li>
<li><a href="13ans.ph">Les Moins de 13 ans</a></li>
<li><a href="15ans.php">Les Moins de 15 ans</a></li>
<li><a href="18ans.php">Les Moins de 18 ans</a></li>
<li><a href="seniors.php">Les Séniors</a></li>
<li><a href="feminines.php">Les Féminines</a></li>
<li><a href="veterans.php">Les Vétérans</a></li>
<li><a href="futsal.php">Le Futsal</a></li>
</ul>
</dd>
</dl>

le JAVASCRIPT
<script type="text/javascript">

</script>

d'ou viens mon erreur ?
merci d'avance.

Message édité par elti69 le 19-06-2006 à 11:48:11

Publicité

xtof_83

Freeride Spirit

Code :

<?php
include 'includes/menu.js';
?>

:ouch: :ouch:

elti69

je ne comprends pas tres bien ta remarque xtof_83... je suis bien oblige d'inclure le javascript qq part non?

xtof_83

Freeride Spirit

ouais sur, mais ça se fait pas comme ça

Enfin sinon tu as mis tout le code la page ?

Si non donne nous la page ça sera mieux, ou bien tu nous files le code généré, pas ton code de fichier

elti69

alors le code genere est

Citation :

<!DOCTYPE html PUBLIC "-//W3C//Dtd XHTML 1.1//FR" "http://www.w3.org/tr/xhtml1/Dtd/xhtml1-strict.dtd">
<html>
<head>

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

<link rel="stylesheet" href="css/ffff.css" />
<script type="text/javascript">

</script> </head>
<body>
<a id="lien" href="index.html" target="_self" title="FFFC"></a>
<div id="page">

<div id="bandenoire">
<div id="logo"></div>
<div id="header"><font color="#ffffff"><marquee width="695px" scrolldelay="100" scrollamount="6" behavior="scroll"><br />
Ici le texte de la partie noire. modifiable dans la partie administration. </marquee></font></div>

<div id="ombredroite"></div>
</div>

<div id="menu">
<div id="menubggauche">

</div>
<div id="menu3">
<div id="menucentre"></div>

<div id="menutexte">
<dl>

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

<dl>
<dt onmouseover="javascript:montre('smenu1');"><a href="news.php">News</a></dt>

<dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre('');">
<ul>
<li><a href="news.php">Les dernières</a></li>
<li><a href="archives.php">Les Archives</a></li>
</ul>

</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenu2');"><a href="club.php">Le Club</a></dt>

<dd id="smenu2" onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre('');">
<ul>
<li><a href="club.php">Le Club</a></li>
<li><a href="ecoledefoot.php">L'école de foot</a></li>
<li><a href="debutants.php">Les Débutants</a></li>
<li><a href="poussins.php">Les poussins</a></li>
<li><a href="benjamins.php">Les Benjamins</a></li>
<li><a href="13ans.ph">Les Moins de 13 ans</a></li>
<li><a href="15ans.php">Les Moins de 15 ans</a></li>
<li><a href="18ans.php">Les Moins de 18 ans</a></li>
<li><a href="seniors.php">Les Séniors</a></li>
<li><a href="feminines.php">Les Féminines</a></li>
<li><a href="veterans.php">Les Vétérans</a></li>
<li><a href="futsal.php">Le Futsal</a></li>
</ul>
</dd>
</dl>
<dl>

<dt onmouseover="javascript:montre();"><a href="contact.php" title="Contact">Contact</a></dt>
</dl>

<dl>

<dt onmouseover="javascript:montre();"><a href="liens.php" title="Liens">Liens</a></dt>
</dl> </div>

<div id="menubottom"></div>

</div>
<div id="menubgdroite">

</div>

</div>

<div id="central">
<div id="centraltop">

</div>
<div id="centralbggauche">

</div>

<div id="contenu">
<div id="categorie"><form action="/news.php" method="get" name="categories"> <select name="cat" class="categorie" onchange="this.form.submit();"><option value="">choisissez votre catégorie</otpion><option value="infos">Toutes les infos</otpion><option value="Ecole de foot">Ecole de foot</option><option value="Débutants">Débutants</option><option value="Poussins">Poussins</option><option value="Benjamins">Benjamins</option><option value="Moins de 13 ans">Moins de 13 ans</option><option value="Moins de 15 ans">Moins de 15 ans</option><option value="Moins de 18 ans">Moins de 18 ans</option><option value="Séniors">Séniors</option><option value="Féminines">Féminines</option><option value="Vétérans">Vétérans</option><option value="Futsal">Futsal</option><option value="Infos Club">Infos Club</option> </select></form></div><h1>Les infos du Ffff</h1><div id="news"><h3>Ecole de foot</h3>
<h4>Posté le Mardi 6 Juin 2006</h4>
<h2>UNE NOUVELLE RECRUE AU Ffff</h2><div id="introduction">Toute l'équipe dirigeante fait des efforts de recrutement, en priviligiant la qualité.</div></div><div id="clearer"></div><div id="suite"><a href="news.php?news=8 ">» Lire la suite</a></div><div id="news"><h3>Moins de 15 ans</h3>
<h4>Posté le Lundi 5 Juin 2006</h4>
<h2>CLAIREFONTAINE</h2><div id="introduction"><img src="images/upload/diarra.jpg" class="gauche" />Alou Diarra (photo) a retrouvé les autres Tricolores dans les Yvelines au Centre Technique National. Il s'est ainsi exprimé : "Je vis vraiment de très beaux moments avec tous mes coéquipiers. Je suis heureux de retrouver Clairefontaine après cette coupure qui fait du bien.<br />
</div></div><div id="clearer"></div><div id="suite"><a href="news.php?news=7 ">» Lire la suite</a></div><div id="news"><h3>Ecole de foot</h3>
<h4>Posté le Lundi 5 Juin 2006</h4>
<h2>LE PROGRAMME DES BLEUS</h2><div id="introduction"><img src="images/upload/abidal.jpg" class="droite" />Les Bleus de Raymond Domenech ont débuté leur préparation par un stage à Tignes du dimanche 21 au vendredi 26 mai. Ils ont rencontré le Mexique (1-0), puis le Danemark (2-0) avant de recevoir la Chine mercredi prochain et de s'envoler pour l'Allemagne le jeudi 8 juin.<br />
</div></div><div id="clearer"></div><div id="suite"><a href="news.php?news=6 ">» Lire la suite</a></div><h1 class="dernieresnews">Les dernieres news</h1><p class="dernieresnews">Le 5 Mai 2006 <a href="news.php?news=5">LES ENTRAINEURS LIBRES</a></p><p class="dernieresnews">Le 5 Mai 2006 <a href="news.php?news=4">ECHAUFEMENT</a></p><p class="dernieresnews">Le 5 Mai 2006 <a href="news.php?news=3">LA TUNISIE</a></p><p class="dernieresnews">Le 5 Mai 2006 <a href="news.php?news=2">L'AUSTRALIE S'INSTALLE</a></p><p class="dernieresnews">Le 5 Mai 2006 <a href="news.php?news=1">TICKETS VOLÉS?</a></p> </div>

<div id="centralbgdroite">

</div>
<div id="centralfooter"></div>
</div>

<div id="droite">
<div id="droitegauche"></div>
<div id="droitecentre">
<div id="droiteombre"></div>
<div id="droitecontenu">
<div id="newletter">
<h1>Newsletter</h1><p>Pour recevoir les infos du club, inscrivez vous à la newsletter en écrivant votre mail:</p><form action="/news.php" method="post" name="newsletter"><input type='text' name='email' maxlength='70' size='18'>  <input class='btn' type='submit' name='submit' value='ok'><br /><input class='radio' type='radio' name='inscription' value='inscription' checked> inscription<input class='radio' type='radio' name='inscription' value='desinscription'> desinscription</form>
</div>
<div id="contact">
<h1>Contact</h1><p><br /><br /></p>
<p>FFC<br />
M.XXXXXX <br />
120 rue des Merles <br />
</p>

<a href="mailto:.com">test@fffc.com</a> </div>
</div>
</div>
<div id="droitedroite"></div>
<div id="droitebottom">
<p></a>
<br /> Site optimisé pour IE, Firefox, Konqueror, Opera, et Safari
<br />Résolution 1024 × 768</p>
</div>

</div>
</div>
</body>
</html>

Message édité par elti69 le 19-06-2006 à 11:49:28

elti69

j'ai trouver mon erreur....
en fait dans mon CSS #menu ul avait un padding de 2 px... en le remplacant par un padding-left:2px tout marche...

je suis curieux en revanche comme je dois integrer mon javascript?

xtof_83

Freeride Spirit

Code :

<?php
include 'includes/menu.js';
?>

ça faisait bizare

Code :

<script type="text/javascript" src="includes/menu.js"></script>

elti69

dans mon menu.js en fait j'ai deja
<script type="text/javascript"> au debut et </script>
donc ca va non?

Message cité 1 fois

xtof_83

Freeride Spirit

heu comment dire....bof

ça a pas dinteret

gatsu35

Blablaté par Harko

elti69 a écrit :

dans mon menu.js en fait j'ai deja
<script type="text/javascript"> au debut et </script>
donc ca va non?

Ben c'est naze [:petrus75]
ce que tu dois faire c'est linker le fichier comme l'a fait xtof_83 et pas autrement.

---------------
Blablaté par Harko

FORUM HardWare.fr

Programmation

HTML/CSS

menu vertical CSS javascript

Sujets relatifs
Fonction mail avec un if else tout bête et javascript confirm()	probleme javascript
[Javascript] pb pour recupérer une valeur (radiobutton)	Code javascript pour mot de passe.
[ PHP \|\| javascript ] le plus securisé	CSS: affichage d'une balise div en bas de page
Différence entre <a href="javascript:toto()"> et <a onClick="..."> ??	petite modif pour menu verti gauche
[RESOLU]Selection ds menu deroulant d'une BD puis echo d'un champ lié	Recrute Découpeur Xhtml/Css Valid (remuneration : on)
Plus de sujets relatifs à : menu vertical CSS javascript

Page générée en 0.052 secondes