Accueil > Forum > > > > Inclure un menu externe dans du html
 Inclure un menu externe dans du html
mardi 30 septembre 2008 à 14:14:04 |
Inclure un menu externe dans du html
chabgyver
|
Bonjour, J'ai crée une interface graphique avec une belle mise en page en css et je voudrai inclure un menu vertical dynamique. Jusque là, ça va, j'ai mon interface et mon menu qui sont séparés. Voilà la liste des fichiers concernés : index.htm design.css menu.htm menu.css La solution paraît simple, il suffirai de coller tout le code du fichier menu.htm dans le code du fichier index.htm mais j'ai peur que ça allourdisse le code et qu'en terme de lisibilité, ça soit pas terrible. Je me demandais s'il y a un moyen pour inclure le menu un peu comme avec la commande : <link href="menu.css" rel="stylesheet" type="text/css">, une routine du même genre mais pour du html. Je sais pas si j'ai réussi à me faire comprendre mais dans le cas contraire, n'hésitez pas à me demander des précisions. Je sais que ce genre de manip se fait en php mais là, j'avoue être un peu à la rue. Merci d'avance. |
|
mardi 30 septembre 2008 à 14:30:05 |
Re : Inclure un menu externe dans du html
bultez
|
bonjour, on peut.... quoique.... pas en html. tu peux faire un include en asp,php, ruby... ( le langage du serveur quoi ) tu peux faire un #include en ssi ( ou shtml ) tu pourrais faire un <Script Type="Text/JavaScript" Src="fichier.js"></Script> qui ferait des docume,nt.write... mais franchement : vaut mieux éviter cette solution. Cordialement |
|
mardi 30 septembre 2008 à 14:39:04 |
Re : Inclure un menu externe dans du html
chabgyver
|
Donc, si je comprends bien, il ne me reste que 2 choix :
Soit, je sauvegarde mon fichier en php, ce qui me permettra de mettre une routine comme je veux.
Soit je travaille à l'ancienne en collant mon code html du menu dans le code du fichier index.
Tu me conseille quoi ? La première méthode je présume mais j'aurai besoin d'un coup de main.
|
|
mardi 30 septembre 2008 à 14:50:29 |
Re : Inclure un menu externe dans du html
bultez
|
tu oublies le SSI ( shtml ) remarque que tout le monde l'oublie... on se demande bien pourquoi ! et, mon foie, en php : <?php include "ton fichier que tu veux qu'il est à toi"; ?> point barre. |
|
mercredi 1 octobre 2008 à 09:27:49 |
Re : Inclure un menu externe dans du html
chabgyver
|
Oui, effectivement, je n'ai pas pensé au SSI, tu fais comment avec ça ?
|
|
mercredi 1 octobre 2008 à 10:18:09 |
Re : Inclure un menu externe dans du html
bultez
|
<!--#include file="monFicher.shtml" --> ça fonctionne, en fait, comme le php, sur un site ou en local mais avec une "émulation de serveur" ( wamp, easyphp... par exemple ) le fichier qui inclus doit s'appeler .shtml.tous les fournisseurs d'accès, tous les navigateurs... ne le proposent pas, tester ainsi ( par exemple ) : lu chez http://scarabee.com/TRANCHES/SSI/configurationnecessaire.shtml
toute la doc nécessaire y est, doit y avoir d'autres docs.
Cordialement
|
|
mercredi 1 octobre 2008 à 11:17:48 |
Re : Inclure un menu externe dans du html
chabgyver
|
J'ai essayé dans tous les sens mais ça change pas grand chose, mon cas est sûrement plus complexe que prévu,
Voilà le code de mon fichier INDEX.html :
<html>
<head>
<title>Radio balistiq</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="design.css" rel="stylesheet" type="text/css" />
</head>
<body>
<table width="990" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td>
<div id="banniere">
<div id="logo"><img src="img/logo.png" width="170" height="88" alt="" /></div>
<div id="header"><img src="img/header.png" width="820" height="88" alt="" /></div>
</div>
<div id="center">
<table width="990" cellspacing="0" cellpadding="0" border="0" align="center">
<tr>
<td width="170" class="menu" valign="top"></td>
<td width="820" class="contener" valign="top">
<p align="center" class="texte">Venez Découvrir notre hôtel restaurant L'Escapade Logis de France 2 cheminées, se situant sur la route touristique de la vallée de la Creuse à 2 km du centre ville d'Argenton sur Creuse direction le PECHEREAU GARGILESSE (D48).</p>
</td>
</tr>
<tr>
<td colspan="4" style="background-color:#"><img src="img/footer.png" width="990" height="65" alt="" /></td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</body>
</html>
Voilà le code de mon fichier MENU.html :
<!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>un menu déroulant en CSS et javascript</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<=15; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
</script>
<link href="menu.css" rel="stylesheet" type="text/css">
</head>
<body>
<!-- Menu -->
<dl id="menu">
<dt onmouseover="javascript:montre('smenu1');"><a href="#">ACCUEIL</a></dt>
<dt onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre();">PRESENTATION</dt>
<dd id="smenu2" onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre();">
<ul>
<li><a href="#">Balistiq</a></li>
<li><a href="#">Yes we can can</a></li>
<li><a href="#">L'équipe</a></li>
</ul>
</dd>
<dt onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre();">LA RADIO</dt>
<dt onmouseover="javascript:montre('smenu4');" onmouseout="javascript:montre();">PROGRAMME</dt>
<dt onmouseover="javascript:montre('smenu5');" onmouseout="javascript:montre();">CULTURE</dt>
<dd id="smenu5" onmouseover="javascript:montre('smenu5');" onmouseout="javascript:montre();">
<ul>
<li><a href="#">Cinéma Apollo</a></li>
<li><a href="#">Festivals</a></li>
<li><a href="#">Concerts</a></li>
<li><a href="#">Scènes locales</a></li>
</ul>
</dd>
<dt onmouseover="javascript:montre('smenu6');" onmouseout="javascript:montre();">PRESSE</dt>
<dt onmouseover="javascript:montre('smenu7');" onmouseout="javascript:montre();">EMISSIONS</dt>
<dd id="smenu7" onmouseover="javascript:montre('smenu7');" onmouseout="javascript:montre();">
<ul>
<li><a href="#">Fiches concept</a></li>
<li><a href="#">Les émissions</a></li>
</ul>
</dd>
<dt onmouseover="javascript:montre('smenu8');" onmouseout="javascript:montre();">COMMUNAUTE</dt>
<dd id="smenu8" onmouseover="javascript:montre('smenu8');" onmouseout="javascript:montre();">
<ul>
<li><a href="#">Contactez-nous</a></li>
<li><a href="#">Livre d'or</a></li>
<li><a href="#">Newsletter</a></li>
<li><a href="#">Forum</a></li>
<li><a href="#">Myspaces</a></li>
</ul>
</dd>
<dt onmouseover="javascript:montre('smenu9');" onmouseout="javascript:montre();">PARTENAIRES</dt>
<dt onmouseover="javascript:montre('smenu10');" onmouseout="javascript:montre();">GOODIES</dt>
<dd id="smenu10" onmouseover="javascript:montre('smenu10');" onmouseout="javascript:montre();">
<ul>
<li><a href="#">Fonds d'écrans</a></li>
<li><a href="#">Jeux</a></li>
<li><a href="#">Photos</a></li>
</ul>
</dd>
<dt onmouseover="javascript:montre('smenu11');" onmouseout="javascript:montre();">ECOUTER</dt>
<dd id="smenu11" onmouseover="javascript:montre('smenu11');" onmouseout="javascript:montre();">
<ul>
<li><a href="#">Playlist</a></li>
<li><a href="#">Radio-FM</a></li>
<li><a href="#">Mix-DJ</a></li>
<li><a href="#">Interviews</a></li>
</ul>
</dd>
<dt onmouseover="javascript:montre('smenu12');" onmouseout="javascript:montre();">VOIR</dt>
</dl>
</body>
</html>
Le but du jeu est donc d'insérer le fichier menu.html avec un Include dans index.html en lieu et place de l'espace prévu à cet effet.
Si tu as une idée.
|
|
mercredi 1 octobre 2008 à 11:27:18 |
Re : Inclure un menu externe dans du html
bultez
|
|
|
mercredi 1 octobre 2008 à 12:16:45 |
Re : Inclure un menu externe dans du html
chabgyver
|
Je me doute que ça doit être d'une grande simplicité mais quand on a jamais fais ça, c'est pas simple, doc voilà comment j'ai fais : J'ai renommé le fichier INDEX.html en INDEX.SHTML Dedans, j'ai mis ceci : <td width="170" class="menu" valign="top"><div id="menu"><!--#include virtual="include/menu.shtml"--></div></td> Pour savoir où placer mon menu, j'ai travaillé à l'ancienne, à savoir que j'ai crée une div et à l'intérieur, j'ai copier le code complet de mon menu, ça machait bien donc, c'est bien là qu'il faut mettre la balise include. Ensuite, j'ai renommé le fichier MENU.HTML en MENU.SHTML J'ai aussi crée un répertoire include et j'ai mis les fichiers menu.shtml et menu.css dedans. Pour testé dans les meilleures conditions, j'ai envoyé sur l'un de mes comptes ftp mais mon menu n'apparaît pas, enfin bon, je vais finir par y arriver. |
|
mercredi 1 octobre 2008 à 12:47:17 |
Re : Inclure un menu externe dans du html
bultez
|
euh... plusieurs remarques. __ tu es sûr de virtual ? j'use de file. __ MENU.SHTML ce n'est pas menu.shtml __ tu es sûr que le répertoire include est bien dans le même répertoire ? __ tu as essayé le petit exemple ? ton fai ou ton navigateur aiment bien ? __ ...
|
|
Cette discussion est classée dans : menu, code, html, externe, inclure
 Répondre à ce message
 Sujets en rapport avec ce message
Code html pour un menu dinamyque trés diférent. [ par baraudroit ]
Bonjour Voila je vous explique mon probleme je recherche un code html pour un menu. http://www.unionstreetlive.fr/Image3.png je voudré y mettre un
affichage cyclique de plusieurs pages web dynamiques [ par kate1910 ]
bonjour pendant ma periode de stage, je doit effectuer une application, il s'agit d'un affichage cyclique des pages web dynamiques existantes et ind
code vers page html au hasard d'un dossier [ par subderground ]
Bonjour, J'essaye de faire des ex/jeux math (primaire). J'ai des exercies sur des fichiers html (1 par page). Je voudrais trouver un moyen (code? jav
Contenu appelé en innerHTML et THICKBOX [ par Castelcerf ]
Bonjour, je viens vous demander un coup de main car étant un peu débutant encore en javascript je bloque sur un problème. Je vous explique le context
Menu avec cotès arrondis | HTML - CSS | [ par darksam ]
[b]Bonsoir,[/b] Comme le titre l'indique, j'aimerais créer un menu avec cotés arrondis ([i]HTML - CSS[/i]). J'ai visualiser beaucoup de sites Web qui
Menu déroulant [ par odakawoi ]
Salut à vous, Voici, tout d'abord, mes codes : [B]En :[/B] [CODE=java] function chgpage(formulaire) { if (formulaire.listepages.selectedIndex
JS: double boucle et compatibilité... [ par Doluvic400 ]
Bonjour, A force de travail j'ai élaborer (en piquant des bouts par ci par la) un script permettant d'avoir de joli couleurs sur les carrés de liste
probleme de frame [ par Maniaxman ]
bonjour,je chercherais un code en javascript permettant d'afficher le code d'une page HTML distante.ou alors d'une page HTML d'une frame incluant un s
code html qui affiche un message d'erreur en boucle losrqu'on clique sur la croix [ par VFPT ]
Bonjour, je cherche un code html qui me permetrai que quand un utilisateur cliquera sur la croix de mon site, un message d'erreur s'affichera en boucl
PROBLEME DIV [ par elmarko ]
Salut,je sors juste d'une formation rapide sur "dream/code html/css" de base... et j'ai besoin d'une explication sur l'attribution d'un comportement à
 Livres en rapport
|
Derniers Blogs
 JOYEUX ANNIVERSAIRE NIXJOYEUX ANNIVERSAIRE NIX par ebartsoft
Souhaitons un bon et joyeux anniversaire à notre hôte à tous, Nix.
Je ne le répéterais jamais assez mais sans lui rien ne serait possible. Il défit en permanence les lois de la gravité et comme il le dit si bien, si tu lui fais confiance ça devra...
Cliquez pour lire la suite de l'article par ebartsoft IMAGINE CUP 2012, MAKE A SIGN EN FINALEIMAGINE CUP 2012, MAKE A SIGN EN FINALE par junarnoalg
Voilà qui est fait, la nouvelle est officielle ! L'équipe belge "Make a Sign" va au pays des kangourous défendre son projet dans la catégorie Software Design. http://www.imaginecup.com/CompetitionsContent/Competition/WorldwideFinalists.aspx V...
Cliquez pour lire la suite de l'article par junarnoalg KINECT 1.5 IS OUT !KINECT 1.5 IS OUT ! par Vko
La version 1.5 du Kinect For Microsoft vient tout juste de sortir ! Plein de nouveautés: Tracking de squelette en Near Mode Détection en position assise Détection faciale avec un SDK dédié Documentation et des guideline (enfin) Un out...
Cliquez pour lire la suite de l'article par Vko LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) par richardc
Mise à jour des Web API du 14 Mai
Réservez dès maintenant votre journée du 20 juin pour le Windows Azure Dev Camp 2012 à Paris
Mise à jour de Team Foundation Service
MechCommander 2 sur Windows 8
Entity Framework 5 Release Candidate e...
Cliquez pour lire la suite de l'article par richardc REACTIVE EXTENSIONS : CONSOMMER DES SERVICES AVEC RX PARTIE 3, LES PIèGES à éVITERREACTIVE EXTENSIONS : CONSOMMER DES SERVICES AVEC RX PARTIE 3, LES PIèGES à éVITER par Groc
Une mauvaise utilisation de rx lors de l'écriture d'une couche d'accès à des services peut conduire à des cas embarassants avec des erreurs mal gérées, des appels qui ne partent lorsqu'ils le devraient, et même des résultats incorrects . le tout nuis...
Cliquez pour lire la suite de l'article par Groc
Logiciels
 sDEVIS-FACTURES vlPRO (8.1.0.3)SDEVIS-FACTURES VLPRO (8.1.0.3)sDEVIS-FACTURES vlPRO a été mis au point pour les particuliers, créateurs, entrepreneurs, artisa... Cliquez pour télécharger sDEVIS-FACTURES vlPRO 974 Application Server (12.2.4.6)974 APPLICATION SERVER (12.2.4.6)Développez de puissantes applications dans un environnement de 'cloud computing', clusterisé, séc... Cliquez pour télécharger 974 Application Server vPicture (1.4.2.1)VPICTURE (1.4.2.1)Avec vPicture, hébergez vos images facilement et rapidement.
vPicture est un utilitaire simple, ... Cliquez pour télécharger vPicture Easy-Planning (2.2.1.6)EASY-PLANNING (2.2.1.6)Easy-Planning permet de créer des plannings sous la représentation de diagrammes et est adapté au... Cliquez pour télécharger Easy-Planning COM-BACKUP (2.0)COM-BACKUP (2.0)
COM-BACKUP est un logiciel de sauvegarde qui permet de planifier les sauvegardes de vos dossiers ...
Cliquez pour télécharger COM-BACKUP
|