11548 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Menu déroulant / Appel de fichier externe

Alsacréation à la rescousse !
je viens de passer 2h sur google et dreamweaver à me prendre la tête et je trouve pas ! Alors voila le topo :

Je suis en train de créer un site web avec un menu déroulant sur chaque page. Le problème, evidement, c'est que, dès que je veux modifier mon menu, faut que je me tape toutes les pages !

Je sais qu'il existe un moyen d'enregistrer mon menu dans un fichier .JS et de l'appeler avec la fonction
<SCRIPT LANGUAGE="javascript" SRC="menu.js"></SCRIPT>


Mais voila : ça marche pas !


voila ce que j'ai : (j'ai repris un exemple de menu d'alsacréation)
dans le "header" de chaque page j'ai :
<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>


et mon menu se présente sous la forme :
	<dl>			
		<dt onmouseover="javascript:montre('smenu1');"><a href="http://www.photollivier.com">Accueil</a></dt>
			<dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre('');">
				<ul>
					<li><a href="http://www.photollivier.com/">Page d'accueil</a></li>
					<li><a href="http://www.photollivier.com/presentation.html">Présentation</a></li>
					<li><a href="http://www.photollivier.com/soutien.html">Soutien</a></li>
					<li><a href="http://www.photollivier.com/contact.html">Contact</a></li>
				</ul>
			</dd>
	</dl>


Pourriez vous m'expliquer CLAIREMENT (parceque je suis novice et, je pense débile,...) ce que je doit mettre à la fois dans mes pages HTML et surtout dans le fichiers Javascript ?

Un grand merci à celui qui m'aidera ! vraiment...
Modifié par stanfield (23 Jan 2007 - 11:13)
1/ Dans ton .html :

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


2/ Dans ton .js

Vire donc ta première ligne de <script type...
Ainsi que les marques de commentaires html...

Par ailleurs, pour ma part, je mettrais la directive onload dans le .html.

Commence par cela,
Utilise FireFox et son Error Console très utile pour te dire ce qui ne va pas,
Reviens nous voir ensuite.
Modifié par Felipe (23 Jan 2007 - 11:45)
c'est fait, ben ça s'affiche pas tout simplement !

Je vous dit, j'ai passé 2h sur google...

EDIT : Et y'a pas d'erreur selon Firebug
Modifié par stanfield (23 Jan 2007 - 00:09)
Je ne suis pas sûr de comprendre exactement ce que tu cherches à faire.

maintenant si tu souhaites exécuter ta fonction montre sur onload, je te signale que tu déclares ta fonction avec un parametre (id) et que tu l'appelles sans paramètre.

Cela ne risque effectivement pas de marcher bien fort.
ben je cherche à avoir un seul fichier "menu.js" que j'applique à toutes les pages. Comme ça quand je décide de changer le menu (l'organisation, rajouter des éléments,... je n'ai qu'à modifier ce fichier et toutes les pages sont modifiées !

par contre :
a écrit :
fonction montre sur onload, je te signale que tu déclares ta fonction avec un parametre (id) et que tu l'appelles sans paramètre.


C'est du chinois pour moi Smiley smile désolé...
tu peux détailler et me dire ce qui cloche, pourquoi et comment le modifier ?

je te remercie d'avance.
Modifié par stanfield (23 Jan 2007 - 00:56)
Post ton .html et ton .js tels qu'ils sont pour le moment.
Quand tu dis "c'est fait", je ne sais en fait pas ce que tu as fait exactement.

Remarque tout de même : Tu peux copier coller un script trouvé sur le web et l'utiliser tel que c'est décrit sans la moindre connaissance en JS.

Cependant, dès lors que tu veux (à juste titre) faire plus finaud... je doute que tu puisses y arriver sereinement sans connaissance d'un basic de JS.
Hello,
aCOSwt a écrit :
Par ailleurs, pour ma part, je mettrais la directive onload dans le .html.
Ah bon, et pourquoi ? Smiley smile
aCOSwt a écrit :
maintenant si tu souhaites exécuter ta fonction montre sur onload, je te signale que tu déclares ta fonction avec un parametre (id) et que tu l'appelles sans paramètre.

Cela ne risque effectivement pas de marcher bien fort.
Bah a priori, si la fonction est appelée sans paramètre, ça devrait fermer tous les menus, non ? Ce qui doit être le but, je suppose.
Modérateur
salut standfield,

La partie html (la liste) se met dans le html et non dans le fichier js... Smiley rolleyes Ce n'est pas étonnant que ça ne marche pas là... Smiley sweatdrop
Modérateur
Pour la partie html, tu peux l'insérer via les includes php par exemple, ce qui t'évite de multiplier l'écriture du menu sur chacune de tes pages... Smiley cligne

voir ici, et là Smiley smile
ok, ça c'est bon...

mais où je place :
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';}
}


car pour l'instant le menu ne bouge pas... c'est possible de le mettre dans un fichier extérieur ?

EDIT : l'exemple est là : http://www.photollivier.com/essaimenu.php
Modifié par stanfield (23 Jan 2007 - 11:00)
Modérateur
Ce bout de code, tu le places dans un fichier menu.js externe (par exemple) et tu le lies comme suit dans ton fichier php :

<head>
...
<script type="text/javascript" src="menu.js"></script>
...
</head>
juste une dernière petite chose :
est-ce mes pages doivent dorénavant être enregistrée en PHP ? (à cause du script include...)
Administrateur
Bonjour,

stanfield a écrit :
Alsacréation à la rescousse !

Pour qui sont ces serpents qui sifflent sur nos têtes? Smiley rolleyes

include() est une instruction PHP, il vaut donc mieux que le serveur web (Apache ou IIS) pense à demander à PHP de bien vouloir exécuter les pages que les visiteurs demandent Smiley cligne
Pour cela, il faut enregistrer les .htm(l) en .php un par un ou bien utiliser un logiciel comme Ant Renamer si tu as 500 pages ou bien reconfigurer Apache pour qu'il interprète .htm et .html comme .php (voir http://www.commentcamarche.net/apache/apacht.php3 et un bien placé
AddType application/x-httpd-php .htm
Encore une question !
est'il possible de mettre une feuille de style speciale, juste pour le menu ?
comme architecturer tout ça ?

je fais une section <head> dans le fichier menu.php ?
Sujet clos
Aller à