5568 sujets

Sémantique web et HTML

Menu CSS et include php

Bonjour,

J'ai fait un menu déroulant grâce aux codes qui sont sur alsacreations que j'ai ensuite adapté.
Le menu fonctionnait correctement quand tout était sur la même page.
Mais voilà, j'ai fait un include en php et depuis on me signale une erreur sous IE 6 PC.
Le menu saute et on ne peut accéder aux sous-rubriques. J'ai essayé de résoudre le pb mais n'y suis toujours pas parvenue. Il faut dire que je suis sur mac et que tout fonctionne parfaitement sous IE 5 et safari. Donc, il m'est difficile de tester les modifs.
Je précise que ce ne sont pas les modifs CSS que j'ai faites qui sont en causes puisque ça fonctionne très bien sur IE6 PC quand tout est sur une page

Dans ma page "menu.php", j'ai juste le code html du menu.
Dans ma page "page.php", j'ai le javascript et le lien vers ma feuille de style "menu.css" et ce code en haut de page :


<!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">

Modifié par Merkel (18 Feb 2005 - 16:14)
non, ce n'est pas une histoire de chemin puisque le menu s'affiche et les styles sont pris en compte. Mais quand on passe la souris sur un menu, le sous-menu s'afiche mais impossible de l'atteindre.
meso a écrit :
le sous-menu s'afiche mais impossible de l'atteindre.

Smiley ohwell Qu'est ce que tu entends par "l'atteindre". Tu ne peux pas ouvrir les liens ? Ou alors c'est ton javascript qui est merdique et ton menu part en vrille ?

Louis
Je viens de demander des précisions à qulqu'un qui test le menu pour moi.
En fait, quand le menu se déroule, elle peut aller au 1er sous-menu mais dès qu'elle essaie d'aller sur le 2ème, le menu se referme et ceci sur tout le menu.

Voici la page menu.php :
<dl id="menu">
  <dt onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre();">Actualités <img src="images/puce1.gif"></dt>
  <dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre();"> 
    <ul>
      <li><a href="#"><img src="images/puce1.gif" border="0">Journal de l'école</a></li>
      <li><a href="#"><img src="images/puce1.gif" border="0">Expositions</a></li>
      <li><a href="#"><img src="images/puce1.gif" border="0">Conférences</a></li>
      <li><a href="#"><img src="images/puce1.gif" border="0">Concours</a></li>
    </ul>
  </dd>
  <dt onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre();">L'école<img src="images/puce2.gif"></dt>
  <dd id="smenu2" onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre();"> 
    <ul>
      <li><a href="#"><img src="images/puce2.gif" border="0">Présentation</a></li>
      <li><a href="#"><img src="images/puce2.gif" border="0">Organisation/Instances</a></li>
      <li><a href="#"><img src="images/puce2.gif" border="0">La future école</a></li>
    </ul>
  </dd>
  <dt onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre();">Informations pratiques<img src="images/puce3.gif">
    </dt>
  <dd id="smenu3" onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre();"> 
    <ul>
      <li><a href="#"><img src="images/puce3.gif" border="0">Admissions/inscriptions</a></li>
      <li><a href="#"><img src="images/puce3.gif" border="0">Calendrier scolaire</a></li>
      <li><a href="#"><img src="images/puce3.gif" border="0">Administration</a></li>
      <li><a href="#"><img src="images/puce3.gif" border="0">Enseignants et chercheurs</a></li>
    </ul>
  </dd>
  <dt onmouseover="javascript:montre('smenu4');" onmouseout="javascript:montre();">Pédagogie et recherche<img src="images/puce4.gif">
    </dt>
  <dd id="smenu4" onmouseover="javascript:montre('smenu4');" onmouseout="javascript:montre();"> 
    <ul>
      <li><a href="#"><img src="images/puce4.gif" border="0">Organisation des études</a></li>
	  <li><a href="#"><img src="images/puce4.gif" border="0">Règlement des études</a></li>
      <li><a href="#"><img src="images/puce4.gif" border="0">Licence/Master</a></li>
	  <li><a href="#"><img src="images/puce4.gif" border="0">Doctorat</a></li>
      <li><a href="#"><img src="images/puce4.gif" border="0">Stages, workshops</a></li>
      <li><a href="#"><img src="images/puce4.gif" border="0">Recherche</a></li>
    </ul>
  </dd>
  <dt onmouseover="javascript:montre('smenu5');" onmouseout="javascript:montre();">Services<img src="images/puce5.gif">
    </dt>
  <dd id="smenu5" onmouseover="javascript:montre('smenu5');" onmouseout="javascript:montre();"> 
    <ul>
      <li><a href="#"><img src="images/puce5.gif" border="0">Centre de documentation</a></li>
      <li><a href="#"><img src="images/puce5.gif" border="0">Laboratoire photo/vidéo numérique</a></li>
      <li><a href="#"><img src="images/puce5.gif" border="0">Matériauthèque (CRTT)</a></li>
      <li><a href="#"><img src="images/puce5.gif" border="0">Nouvelles technologies</a></li>
    </ul>
  </dd>
  <dt onmouseover="javascript:montre('smenu6');" onmouseout="javascript:montre();">International<img src="images/puce6.gif">
    </dt>
  <dd id="smenu6" onmouseover="javascript:montre('smenu6');" onmouseout="javascript:montre();"> 
    <ul>
      <li><a href="#"><img src="images/puce6.gif" border="0">Les échanges internationaux</a></li>
      <li><a href="#"><img src="images/puce6.gif" border="0">Conditions de départ</a></li>
      <li><a href="#"><img src="images/puce6.gif" border="0">Conditions d'accueil</a></li>
	  <li><a href="#"><img src="images/puce6.gif" border="0">établissements partenaires</a></li>
    </ul>
  </dd>
  <dt onmouseover="javascript:montre('smenu7');" onmouseout="javascript:montre();">Vie étudiante<img src="images/puce7.gif">
    </dt>
  <dd id="smenu7" onmouseover="javascript:montre('smenu7');" onmouseout="javascript:montre();"> 
    <ul>
      <li><a href="#"><img src="images/puce7.gif" border="0">Renseignements pratiques</a></li>
      <li><a href="#"><img src="images/puce7.gif" border="0">Logement</a></li>
      <li><a href="#"><img src="images/puce7.gif" border="0">Bourses</a></li>
      <li><a href="#"><img src="images/puce7.gif" border="0">Associations</a></li>
    </ul>
  </dd>
</dl>


édit par Igor: il manquait la fermeture [ /code] Smiley lol
Modifié par Igor (18 Feb 2005 - 16:11)
Modérateur
Meso, pourrais-tu mettre la balise CODE pour entourer ton code afin d'améliorer la lisibilité de ton message, tel que demandé dans les Aide/Règles du forum ?

Merci
Modifié par Merkel (18 Feb 2005 - 15:20)
Bonjour,
Il faut éditer ton message, tu tapes avant ton code [ code] (sans l'espace) et à la suite [ /code] (toujours sans l'espace).

édit: Smiley winner
Modifié par Igor (18 Feb 2005 - 16:09)
Administrateur
meso a écrit :
j'ai essayé mais ça n'a pas marché.

Il suffit de cliquer sur le bouton pour ouvrir un code, puis de recliquer sur le bouton pour fermer le code.
Ou si tu le fais à la main, c'est [ code] et [/ code] (sans les espaces)

Edit : grillé Smiley cligne
Modifié par Raphael (18 Feb 2005 - 16:01)
Modérateur
J'ai été grillé par Igor aussi, mais j'ai supprimé mon message. Le niveau de réactivité des modérateurs est haut ici ! Smiley biggthumpup
Modérateur
Meso, essaye de le faire manuellement, tel qu'indiqué par Igor ou Raphael. En le faisant manuellement, aucun risque que le navigateur ne cause problème. N'oublis pas les braquettes [ et ] autour du mot CODE.
Modifié par Merkel (18 Feb 2005 - 16:09)
A part ça, j'avais oublié une différence capitale entre la première page qui fonctionnait très bien et la nouvelle version qui est sur 2 page menu.php et page.php qui bug.

J'ai supprimé ce code :
<?xml version="1.0" encoding="iso-8859-1"?>
meso a écrit :

J'ai supprimé ce code :
<?xml version="1.0" encoding="iso-8859-1"?>


Pas de rapport en principe. L'encodage ne modifie pas les proprietés javascript ou css.

Louis
le code Javascript est le suivant :
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 viens de taper manuellement les [balise de codes] mais après prévisualisation, je vois que ça ne marche toujours pas. Donc désolée pour la lisibilité.
Modifié par Olivier (18 Feb 2005 - 16:16)
Wé mais l'utilisation du prologue XML peut faire varier pas mal de choses Smiley cligne
Dans ce cas ici, il ne faut pas le mettre (prologue XML uniquement pour les documents xHTML (servi en tant que tel et non en text/html)

Il manquait le [/code] à la fin de ta partie de code, j'ai édité

[ code] (sans espace)
blalb lalbllalzlla ton code lnllalallnlal
[/code]


;)
Modifié par Olivier (18 Feb 2005 - 16:18)
Non, il ne manquait le [/code] à la fin de ma partie de code.
Mais à chaque fois que je prévisualise ou que je l'envoie, il me le zappe
Sujet clos
Aller à