le 26/12/2005 à 23:28
Suta
bonjour
je suis novice en js
et
Jai un probleme sur un menu deroulant en javascript :
jai une structure de ce genre :
parent1
-lien1
-lien2
parent2
-lien1
-lien2
etc...
je voudrai que la police des "parents" change au survole de la souris
faut il que je change quelque chose dans cette partie de la source ?
merci de votre aide
sinon ben voila la source :
je suis novice en js
et
Jai un probleme sur un menu deroulant en javascript :
jai une structure de ce genre :
parent1
-lien1
-lien2
parent2
-lien1
-lien2
etc...
je voudrai que la police des "parents" change au survole de la souris
faut il que je change quelque chose dans cette partie de la source ?
<STYLE>
<!--
.parent {
font-family: verdana;
font-weight: bold;
font-size: 10pt;
margin-top: 10;
cursor: hand;
}
.child {
font-size: 10pt;
font-weight: normal;
margin-left: 14pt;
}
a:hover { color:red; }
-->
</STYLE>
merci de votre aide
sinon ben voila la source :
<HTML>
<HEAD>
<TITLE>Test de menu dynamique</TITLE>
<STYLE>
<!--
.parent {
font-family: verdana;
font-weight: bold;
font-size: 10pt;
margin-top: 10;
cursor: hand;
}
.child {
font-size: 10pt;
font-weight: normal;
margin-left: 14pt;
}
a:hover { color:red; }
-->
</STYLE>
<SCRIPT LANGUAGE=javascript>
<!--
var intCount = 0;
//-Fonction d'ajout d'entrées principales-------------------------
function DynamicMenu_addParent(strName) {
var strID = 'ID' + intCount++;
var strTemp = '<DIV ID="' + strID + '" CLASS="parent"';
strTemp += ' onClick="expandCollapse(this);">';
strTemp += '<IMG SRC="Graphics/left.gif" Height="12">';
strTemp += ' ' + strName ;
strTemp += '<DIV STYLE="display: none" CLASS="child"></DIV>';
strTemp += '</DIV>';
this.div.innerHTML += strTemp;
this.currentChild = document.getElementById(strID);
}
//-Fonction d'ajout de liens dans le menu-------------------------
function DynamicMenu_addChild(strName,strURL) {
var strTemp = '<A HREF="' + strURL + '"'
+ ' onClick="cancelBubble(arguments[0]);">'
+ strName + '</A><BR>';
if (document.all) {
this.currentChild.children[1].innerHTML += strTemp;
} else {
this.currentChild.childNodes[2].innerHTML += strTemp;
}
}
//-inhibe la cascade d'évènements au DIV conteneur----------------
function cancelBubble(netEvent) {
if (document.all) {
window.event.cancelBubble = true;
} else {
netEvent.cancelBubble = true;
}
}
//-Contracte ou expanse le menu-----------------------------------
function expandCollapse(objElement) {
if (document.all) {
var imgIcon = objElement.children[0];
objElement = objElement.children[1];
} else {
var imgIcon = objElement.childNodes[0];
objElement = objElement.childNodes[2];
}
if (objElement.style.display == "none") {
objElement.style.display = "block" ;
imgIcon.src = "Graphics/bottom.gif" ;
} else {
objElement.style.display = "none" ;
imgIcon.src = "Graphics/left.gif" ;
}
}
//-Fonction de création de menu dynamique-------------------------
function DynamicMenu() {
var id = "Menu" + intCount++;
document.write('<DIV Id="' + id + '"></DIV>');
this.div = document.getElementById(id);
this.currentChild = null;
this.addParent = DynamicMenu_addParent;
this.addChild = DynamicMenu_addChild;
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT Language="Javascript">
<!--
var menu = new DynamicMenu();
menu.addParent("Le langage Javascript");
menu.addChild("Page d'accueil",
"../javascript.html");
menu.addChild("Etude du langage",
"../Langage/ecmascript.html");
menu.addChild("Les objets clients",
"../ObjetsClients/javascript.html");
menu.addChild("La bibliothèque de code",
"../Bibliotheque/index.html");
menu.addChild("Le fabuleux J-Project",
"../J-Project/jproject.html");
menu.addParent("Autres langages du Web");
menu.addChild("Le langage HTML",
"../../Html/index.html");
menu.addChild("Le langage XML",
"../../Xml/index.html");
menu.addChild("Le langage CSS",
"../../Css/styles.html");
menu.addParent("Quelques petits jeux");
menu.addChild("Dynamic PingPong",
"../../../../../Programmes/Jeux/PingPong/PingPong.html");
menu.addChild("Casse briques", "gamesCasseBriques.html");
//-->
</SCRIPT>
</BODY>
</HTML>
