Menu slide Java et CSS
Une série de menus CSS et Java compatibles TOUS navigateurs
Voir le menu en iframe popup
Voir le menu Slide CSS et Javascript
La structure du menu n'étant pas compatible avec l'environnement joomla pour les articles, nous devons vous le présenger en iframe thickbox
Télécharger le pack de ce menu :
Le code CSS pour ce menu :
<style type="text/css">
.itemTopOff { width:130px; padding:1px; border:1px solid #000000; text-align:center; background-color:#cccccc; }
.itemTopOn { cursor:default; width:130px; padding:1px; border:1px solid #000000; text-align:center; background-color:#333333; }
.itemSubOff { width:115px; padding:1px 6px 1px 11px; border:1px solid #000000; text-align:left; background-color:#cccccc; }
.itemSubOn { cursor:default; width:115px; padding:1px 6px 1px 11px; border:1px solid #000000; text-align:left; background-color:#333333; }
.itemTab { cursor:default; width:20px; margin:2px 1px; background:url("tab.gif") no-repeat center; }
.fontOff { font-family:verdana; font-size:10pt; color:#000000; }
.fontOn { font-family:verdana; font-size:10pt; color:#ffffff; }
.tagOff { width:8px; height:13px; float:right; background:url("/tagRN.gif") no-repeat bottom; }
.tagOn { width:8px; height:13px; float:right; background:url("tagRH.gif") no-repeat bottom; }
</style>
|
Réglages couleurs du menu
Il vous suffit de changer les valeurs avec celles qui conviennent à votre site.
Déclaration du javascript :
|
...........................
<script language="javascript" src="slide-path.js"></script>
<script language="javascript" src="script/menuG5LoaderX.js"></script>
</head>
<body onload="showMenu('Demo1')">
...............................
|
Editez le fichier slide-path.js afin de déclarer des valeurs exactes pour les positions de
Réglages du contenu des menus et sous menus :
Il s'effectue au sein du fichier slide-content.js, pas très facile à régler sans un minimum de concentration :
|
addMenu("Demo", "demo-top");
addLink("demo-top", "Accueil", "", "", "");
addSubMenu("demo-top", "Outils javascript", "", "", "tool-sub", "");
addSubMenu("demo-top", "Outils CSS", "", "", "css-sub", "");
addSubMenu("demo-top", "Outils Vidéo", "", "", "video-sub", "");
addLink("demo-top", "Contact", "", "", "");
addLink("demo-top", " ", "", "", "tab");
addSubMenu("tool-sub", "Menus java", "", "", "menu-sub", "");
addLink("tool-sub", "Effets textes", "", "", "");
addSubMenu("tool-sub", "Prototype js", "", "","proto-sub", "");
addLink("tool-sub", "Lightbox V2", "", "", "");
addLink("css-sub", "Bannières", "", "", "");
addLink("css-sub", "Menus boutons", "", "", "");
addLink("css-sub", "Effets Rollover", "", "", "");
addLink("css-sub", "Les Layers", "", "", "");
addLink("video-sub", "Logiciels libres", "", "", "");
addLink("video-sub", "Tutos Vidéo", "", "", "");
addLink("video-sub", "Générateurs de codes", "", "", "");
addLink("menu-sub", "Menus slide", "", "", "");
addLink("menu-sub", "Menus images", "", "", "");
addLink("menu-sub", "Menus boutons", "", "", "");
addLink("proto-sub", "Sur Guppy", "", "", "");
addLink("proto-sub", "Sur vos sites", "", "", "");
endMenu();
|
Déclaration du menu("nom", "ligne_top");
ajouter un lien ("ligne_top", "titre', "", "", "");
ajouter un sous menu ("ligne_top", "nom_menu", "", "", "nom_sous_menu", "",);
ajouter un sous menu ("ligne_top", "nom_menu1", "", "", "nom_sous_menu1", "",);
ajouter un sous menu ("ligne_top", "nom_menu2", "", "", "nom_sous_menu2", "",);
ajouter un lien sec (ligne_top", "Contact", "", "", "",);
ajouter un lien sec(ligne_top," ", "", "", "tab");
ajouter un sous menu("nom_sous_menu", "titre", "", "", "sous-sous-menu", "");
ajouter un lien("nom_sous_menu", "titre1", "", "", "");
ajouter un sous menu("nom_sous_menu", "titre2", "", "","sous-sous-menu1", "");
ajouter un lien("nom_sous_menu", "titre3", "", "", "");
ajouter un lien(""nom_sous_menu1", "titre4", "", "", "");
ajouter un lien(""nom_sous_menu1", "titre5", "", "", "");
ajouter un lien(""nom_sous_menu1", "titre6", "", "", "");
ajouter un lien(""nom_sous_menu1", "titre7", "", "", "");
ajouter un lien("nom_sous_menu2", "titre8", "", "", "");
ajouter un lien("nom_sous_menu2", "titre9", "", "", "");
ajouter un lien("nom_sous_menu2", "titre10", "", "", "");
ajouter un lien("sous-sous-menu", "titre11", "", "", "");
ajouter un lien(""sous-sous-menu", "titre12", "", "", "");
ajouter un lien(""sous-sous-menu", "titre13", "", "", "");
ajouter un lien("sous-sous-menu1", "titre14", "", "", "");
ajouter un lien("sous-sous-menu1", "titre15", "", "", "");
déclaration_fin_de_menu(); |
Vous voyez que vous pouvez mettre des sous menus, des sous-sous-menus, et gérer leurs couleurs par le css.
Nous vous montrerons d'autres exempls basés sur le meme schéma, la même infrastructure java et css, ayant un aspect très différent
Il ne manque que l'ajout des liens sous la forme :
addLink("tool-sub", "Effets textes", "", "http://serveur_hébergeur/getfilehtml.php?lng=fr&id=83", "");
addLink("menu-sub", "Menus images", "", "http://serveur_hébergeur/roll.html", "");
addLink("demo-top", "Contact", "", "mailto:franc83@free.fr", "");
Que ce soient des liens php, html, mailto, le menu fonctionne comme tout menu
 Citez cet article
|
- Les messages comportant des attaques verbales contre les personnes seront supprimés.
- Vous pouvez renouveler le code de sécurité en appliquant un rafraîchissement à votre navigateur.
- Appliquer cette méthode de rafraîchissement si vous avez entré un mauvais code de sécurité.
|
Powered by AkoComment Tweaked Special Edition v.1.4.6
AkoComment © Copyright 2004 by Arthur Konze - www.mamboportal.com
All right reserved |
Commenter cet article
