PDA

Click to See Complete Forum and Search --> : Underlined, bah!

xlegend
07-21-2003, 10:06 AM
<html>
<head>
<style type="text/css">
<!--
#foldheader {cursor:hand;}
#foldsubheader {cursor:hand;text-indent:10px;}
#foldinglist {text-indent:10px;}
#subfoldinglist {text-indent:20px;}
-->
</style>

<script language="JavaScript1.2">
<!--
/*
* Based on Folding Menu Tree
* Dynamic Drive (www.dynamicdrive.com)
* For full source code, installation instructions,
* 100's more DHTML scripts, and Terms Of
* Use, visit dynamicdrive.com
*
* Updated to support arbitrarily nested lists
* by Mark Quinn (mark@robocast.com) November 2nd 1998
*
* Edited by Exuro
* No images required version
*
*/

var head="display:''"

function change(){
if(!document.all)
return
if (event.srcElement.id=="foldheader" || event.srcElement.id=="foldsubheader") {
var srcIndex = event.srcElement.sourceIndex
var nested = document.all[srcIndex+1]
if (nested.style.display=="none") {

var head = "display='none'"
nested.style.display=''
event.srcElement.style.listStyleType="circle"
}
else {
nested.style.display="none"
event.srcElement.style.listStyleType="square"
}
}
}

document.onclick=change

//-->
</script>
</head>
<body>
<h2>Menu:</h2>

<ul style="list-style-type:square;">
<li id="foldheader" style="font-size:medium">Games</li>
<SPAN id="foldinglist" style="display:none">

<li id="foldsubheader">Computer</li>
<SPAN id="foldinglist" style="display:none">

<SPAN id="subfoldinglist">
<li><a href="JavaScript: alert(sorry)">Starcraft</a></li>
<li><a href="games/computer/aoe2/index.html">AOE II</a></li>
<li><a href="JavaScript: alert(sorry)">DiabloI/II</a></li>
<li><a href="JavaScript: alert(sorry)">Nox</a></li>
<li><a href="JavaScript: alert(sorry)">Sim Games</a></li>
</SPAN>

</SPAN>

<li id="foldsubheader">Hand Held</li>
<SPAN id="foldinglist" style="display:none">

<SPAN id="subfoldinglist">
<li><a href="JavaScript: alert(sorry)">GB/GBC</a></li>
<li><a href="JavaScript: alert(sorry)">GBA</a></li>
</SPAN>

</SPAN>

<li id="foldsubheader">Console</li>
<SPAN id="foldinglist" style="display:none">

<SPAN id="subfoldinglist">
<li><a href="JavaScript: alert(sorry)">N64</a></li>
<li><a href="JavaScript: alert(sorry)">Game Cube</a></li>
<li><a href="JavaScript: alert(sorry)">PSX</a></li>
<li><a href="JavaScript: alert(sorry)">PS2</a></li>
<li><a href="JavaScript: alert(sorry)">DC</a></li>
<li><a href="JavaScript: alert(sorry)">Other</a></li>
</SPAN>
</SPAN>

</SPAN>

<li id="foldheader" style="font-size:medium">Animé</li>
<SPAN id="foldinglist" style="display:none">

<li><a href="anime/tenchi/index.html">Tenchi Muyo!</a></li>
<li><a href="JavaScript: alert(sorry)">Evangelion</a></li>
<li><a href="JavaScript: alert(sorry)">DBZ</a></li>
<li><a href="JavaScript: alert(sorry)">Gundam Wing</a></li>

</SPAN>

<li id="foldheader" style="font-size:medium">Website Stuff</li>
<SPAN id="foldinglist" style="display:none">

<SPAN id="foldinglist">
<li><a href="websites/walkthroughs.html">Web-Scripting Tutorials</a></li>
<li><a href="websites/tools.html">Helpful Utilities</a></li>
</SPAN>

</SPAN>

<li id="foldheader" style="font-size:medium">Downloads</li>
<SPAN id="foldinglist" style="display:none">

<SPAN id="foldinglist">
<li><a href="JavaScript: alert(sorry)">All</a></li>
<li><a href="JavaScript: alert(sorry)">Music</a></li>
<li><a href="JavaScript: alert(sorry)">Games</a></li>
<li><a href="JavaScript: alert(sorry)">Emulation</a></li>
</SPAN>

</SPAN>

<li id="foldheader" style="font-size:medium">Misc.</li>
<SPAN id="foldinglist" style="display:none">

<SPAN id="foldinglist">
<li><a href="JavaScript: alert(sorry)">Email Us</a></li>
<li><a href="JavaScript: alert(sorry)">The Phoenix Team</a></li>
<li><a href="JavaScript: alert(sorry)">Ouuuuch!</a></li>
</SPAN>

</SPAN>

<li id="foldheader" style="font-size:medium">Links</li>
<SPAN id="foldinglist" style="display:none">

<SPAN id="foldinglist">
<li><a href="JavaScript: alert(sorry)">Link To Us</a></li>
<li><a href="JavaScript: alert(sorry)">Affiliates</a></li>
</SPAN>
</SPAN>
</ul>
</body>
</html>

Above is copy of the code I use for the folding menus on my website. I would like to alter it so that the main headings (links, anime, website stuff, etc) will be underlined.

Would anyone be willing to help me out with this problem.
toicontien
07-21-2003, 01:52 PM
Alter your CSS as follows:

#foldheader {
cursor:hand;
text-decoration: underline;
}
#foldsubheader { cursor:hand; text-indent:10px; }
#foldinglist {text-indent:10px;}
#subfoldinglist {text-indent:20px;}

That should do it.

Also, take the spaces out of <a href="java script: ...">

It should be <a href="javscript: alert(sorry);">

Then, in your javascript, create a global variable called sorry and assign some sort of error message to it.

IN YOUR JAVASCRIPT AT THE TOP OF THE CODE:

var sorry = "Sorry, this is unavailable at this time.\nCheck back soon!";

OR

Change href="javascript: alert(sorry);"

TO

href="javascript: alert("Sorry");

Otherwise, your links give javascript errors.