Un menu toujours visible sur vos pages Web
(pour Internet Explorer)


Le menu qui sert à naviguer à l'intérieur d'un site Web est souvent un casse-tête :
- il doit être facilement lisible et en même temps permettre l'accès à un grand nombre de pages différentes
- il doit rester visible sur toutes les pages du site
- il doit être mis à jour facilement (de préférence sans recopier le menu sur chaque page)
- et dans la mesure du possible, il ne doit pas disparaitre lors des "scrollings" (défilements de l'écran vers le bas ou la droite).

Ces problèmes sont bien résolus par la technique des frames qui découpent l'écran (horizontalement et / ou verticalement) en plusieurs fenêtres indépendantes.
On peut ainsi placer par exemple un menu principal dans un frame horizontal en haut de l'écran et un menu secondaire dans un frame vertical à gauche de l'écran.
Cette technique très efficace fait actuellement l'object de critiques, ses détracteurs insistant sur la non compatibilité avec certains navigateurs (anciens) et sur des problèmes rencontrés lors du référencement par des moteurs de recherche automatiques.
Il est vrai qu'un lien pointant vers une page isolée d'un site fonctionnant avec des frames risque de perdre beaucoup de son intérêt, puisqu'elle est sortie de son contexte.

De nombreux sites récents ont completement renoncé aux frames et affichent un menu répeté en tête de chaque page, menu qu'il faut aller rechercher à chaque fois qu'on arrive en bas de page.

JavaScript peut apporter diverses solutions à ce problème.
Celle qui est proposée ici est basée sur un menu completement créé par JavaScript qui se repositionne en tête de page à chaque scrolling.
Le menu se déploie en sous-menus au passage de la souris, chaque ligne du sous-menu conduisant à une page du site.
Plusieurs avantages à cette configuration :
Le menu étant completement écrit en JavaScript, peut être isolé dans une page JavaScript indépendante à laquelle il est fait appel sur chaque page du site : le simple fait d'inscrire
<SCRIPT SRC="menus.js"></SCRIPT>
dans le corps de la page Web va permettre l'affichage du menu.
Le nombre de pages visées par le menu peut être très grand. Dans le fichier présenté ci-après, le menu principal contient 9 entrées, et chaque sous-menu peut en contenir une vingtaine (mais on pourrait faire beaucoup plus).
La mise à jour du menu est très simple, il suffit, dans la page menus.js, d'indiquer les noms de menus, les noms de sous-menus et les adresses des pages web visées.
On peut même incorporer un lien vers une feuille de style, toutes les pages munies du menu se trouvant ainsi dotées du même style.
Il suffit d'ajouter en première ligne de la page menus.js, la ligne :
document.write("<link rel='stylesheet' type='text/css' href='fstyle.css'>")
pour faire référence à la feuille de style "fstyle.css".
Il peut être utile d'insérer une référence au répertoire contenant les pages du site si les liens sont des liens relatifs :
document.write("<BASE href='http://jacxl.free/'>") (à placer comme la référence à la feuille de styles en début de la page javascript).
Principal inconvénient, la compatibilité avec les différents navigateurs (écrit pour IE, version acceptant les styles).

cliquez ici pour voir le menu
clic droit ici pour télécharger la page menus.js contenant le menu.