Hey, can anyone help me with a script that will change image of bullet onmouseover and return on mouse out for a folding tree menu.
Would be very thankful if you can help me out...
Here is the code of the tree menu:
<html>
</head>
<style>
<!--
#foldheader{cursor
ointer;cursor:hand ; font-weight:bold ;list-style-image:url(fold.gif)}
#foldon{cursor
ointer;cursor:hand ; font-weight:bold ;list-style-image:url(fold1.gif)}
#foldinglist{list-style-image:url(list.gif)}
//-->
</style>
<script language="JavaScript1.2">
<!--
var ns6=document.getElementById&&!document.all
var ie4=document.all&&navigator.userAgent.indexOf("Opera"
==-1
function checkcontained(e){
var iscontained=0
cur=ns6? e.target : event.srcElement
i=0
if (cur.id=="foldheader"
iscontained=1
else
while (ns6&&cur.parentNode||(ie4&&cur.parentElement)){
if (cur.id=="foldheader"||cur.id=="foldinglist"
{
iscontained=(cur.id=="foldheader"
? 1 : 0
break
}
cur=ns6? cur.parentNode : cur.parentElement
}
if (iscontained){
var foldercontent=ns6? cur.nextSibling.nextSibling : cur.all.tags("UL"
[0]
if (foldercontent.style.display=="none"
{
foldercontent.style.display=""
cur.style.listStyleImage="url(open.gif)"
}
else{
foldercontent.style.display="none"
cur.style.listStyleImage="url(fold.gif)"
}
}
}
if (ie4||ns6)
document.onclick=checkcontained
//-->
</script>
</head>
<body style='margin-right: .5in;text-align:right; direction:rtl'>
<font face="Verdana">
<ul>
<li id="foldheader" >one</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=" <li><a href=" News</a></li>
<li><a href=" News</a></li>
</ul>
<li id="foldheader">Webmaster</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=" Drive</a></li>
<li><a href=" Kit</a></li>
<li><a href=" </ul>
<li id="foldheader">Nested Example</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=" 1</a></li>
<li><a href=" 2</a></li>
<li id="foldheader">Nested</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=" 1</a></li>
<li><a href=" 2</a></li>
</ul>
<li><a href=" 3</a></li>
<li><a href=" 4</a></li>
</ul>
</ul>
</font>
</body>
</html>
Would be very thankful if you can help me out...
Here is the code of the tree menu:
<html>
</head>
<style>
<!--
#foldheader{cursor
#foldon{cursor
#foldinglist{list-style-image:url(list.gif)}
//-->
</style>
<script language="JavaScript1.2">
<!--
var ns6=document.getElementById&&!document.all
var ie4=document.all&&navigator.userAgent.indexOf("Opera"
function checkcontained(e){
var iscontained=0
cur=ns6? e.target : event.srcElement
i=0
if (cur.id=="foldheader"
iscontained=1
else
while (ns6&&cur.parentNode||(ie4&&cur.parentElement)){
if (cur.id=="foldheader"||cur.id=="foldinglist"
iscontained=(cur.id=="foldheader"
break
}
cur=ns6? cur.parentNode : cur.parentElement
}
if (iscontained){
var foldercontent=ns6? cur.nextSibling.nextSibling : cur.all.tags("UL"
if (foldercontent.style.display=="none"
foldercontent.style.display=""
cur.style.listStyleImage="url(open.gif)"
}
else{
foldercontent.style.display="none"
cur.style.listStyleImage="url(fold.gif)"
}
}
}
if (ie4||ns6)
document.onclick=checkcontained
//-->
</script>
</head>
<body style='margin-right: .5in;text-align:right; direction:rtl'>
<font face="Verdana">
<ul>
<li id="foldheader" >one</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=" <li><a href=" News</a></li>
<li><a href=" News</a></li>
</ul>
<li id="foldheader">Webmaster</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=" Drive</a></li>
<li><a href=" Kit</a></li>
<li><a href=" </ul>
<li id="foldheader">Nested Example</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=" 1</a></li>
<li><a href=" 2</a></li>
<li id="foldheader">Nested</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=" 1</a></li>
<li><a href=" 2</a></li>
</ul>
<li><a href=" 3</a></li>
<li><a href=" 4</a></li>
</ul>
</ul>
</font>
</body>
</html>