[html]
Beste scholieren/admins/Beheerders,
Ik hoop dat iemand mij hiermee wel kan helpen. Ik zit met een klein probleem. Zoals je hier ziet http://simplythebest.net/...ripts/dhtml_script_3.html wil ik dat mijn menu ook zo sorteerd. zegmaar, als je op klikt zie je een menu naar beneden verschijnen, maar zodra ik op een andere menu kiest (Choice2 ofzo) dan schuift de andere menu die ik net had geopent weer automatisch dicht. Ik hoop dat dit duidelijk is, want ik wil dat namelijk in mijn script hebben.
Wat ik nu heb is, ik heb ook soort gelijke menu als die op SimplytheBest.net maar bij mij is het zo, als je op de menu klikt dat het open gaat, maar als ik weer een ander menu erbij klikt dan blijft die menu die ik eerder heb open gemaakt gewoon open, terwijl ik die automatisch dicht wil hebben.
dit is mijn code (mijn huidige menu):
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
.menutitle{
cursor:pointer;
margin-bottom: 1px;
background-color:#FFC79C;
color:#000000;
width:140px;
padding:1px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}
.submenu{
margin-bottom: 0.5em;
}
</style>
<script type="text/javascript">
/***********************************************
* Switch Menu script- by Martial B of http://getElementById.com/
* Modified by Dynamic Drive for format & NS4/IE4 compatibility
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
var persistmenu="yes" //"yes" or "no". Make sure each SPAN content contains an incrementing ID starting at 1 (id="sub1", id="sub2", etc)
var persisttype="sitewide" //enter "sitewide" for menu to persist across site, "local" for this page only
if (document.getElementById){ //DynamicDrive.com change
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
if(el.style.display != "block"){ //DynamicDrive.com change
for (var i=0; i<ar.length; i++){
if (ar[i].className=="submenu") //DynamicDrive.com change
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function onloadfunction(){
if (persistmenu=="yes"){
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=get_cookie(cookiename)
if (cookievalue!="")
document.getElementById(cookievalue).style.display="block"
}
}
function savemenustate(){
var inc=1, blockid=""
while (document.getElementById("sub"+inc)){
if (document.getElementById("sub"+inc).style.display=="block"){
blockid="sub"+inc
break
}
inc++
}
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=(persisttype=="sitewide")? blockid+";path=/" : blockid
document.cookie=cookiename+"="+cookievalue
}
if (window.addEventListener)
window.addEventListener("load", onloadfunction, false)
else if (window.attachEvent)
window.attachEvent("onload", onloadfunction)
else if (document.getElementById)
window.onload=onloadfunction
if (persistmenu=="yes" && document.getElementById)
window.onunload=savemenustate
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
background-color: #FF9A66;
}
.style2 {
font-family: Tahoma;
font-size: 10px;
}
.style3 {
font-family: Tahoma;
font-size: 14px;
}
.style4 {font-size: 14px}
-->
</style></head>
<body>
<!-- Keep all menus within masterdiv-->
<div id="masterdiv">
<div class="menutitle style2 style2" onclick="SwitchMenu('sub1')">Economy</div>
<span class="submenu style2" id="sub1">
- <a href="new.htm">Inflation Rates</a><br>
- <a href="hot.htm">Banking Systems</a><br>
- <a href="revised.htm">Stock Market Returns</a><br>
- <a href="morezone/">Value of Homes</a><br>
- <a href="new.htm">Gross Domestic Product</a><br>
- <a href="hot.htm">Tourism Rates</a><br>
- <a href="revised.htm">Power Consumption Demands</a><br>
- <a href="morezone/">Popular Consumer</a><br>
- <a href="morezone/">Airport Data</a><br>
</span>
<div class="menutitle style2 style2" onclick="SwitchMenu('sub2')">Demographics</div>
<span class="submenu style2" id="sub2">
- <a href="notice.htm">Population Growth rates</a><br>
- <a href="faqs.htm">Public Education Spending</a><br>
- <a href="help.htm">Public health Spending</a><br>
- <a href="faqs.htm">Public Transit Spending</a><br>
- <a href="help.htm">Cell Phone users data</a><br>
</span>
<div class="menutitle style2 style2" onclick="SwitchMenu('sub3')">Meteorological data</div>
<span class="submenu style2" id="sub3">
- <a href="http://www.codingforums.com">Sunrise & Sunset times</a><br>
- <a href="http://www.codingforums.com">Tidal activity</a><br>
- <a href="http://www.codingforums.com">Temperatures</a><br>
- <a href="http://www.codingforums.com">Rainfall</a><br>
</span>
<div class="menutitle style2 style2" onclick="SwitchMenu('sub4')">Technology</div>
<span class="submenu style2" id="sub4">
- <a href="http://www.javascriptkit.com">Windmill Power generation</a><br>
- <a href="http://www.freewarejava.com">Dike System</a><br>
- <a href="http://www.cooltext.com">Cell Phone usage rates</a><br>
- <a href="http://www.google.com">internet availability</a><br>
- <a href="http://www.google.com">Aquaculture</a><br>
</span>
<div class="menutitle style2 style2" onclick="SwitchMenu('sub5')">Historical landmarks</div>
<span class="submenu style2" id="sub5">
- <a href="http://www.javascriptkit.com">Tallest Buildings</a><br>
- <a href="http://www.freewarejava.com">Monuments</a><br>
- <a href="http://www.cooltext.com">Windmills</a><br>
- <a href="http://www.google.com">Famous Sea ports</a><br>
- <a href="http://www.google.com">Distances between important cities in Holland</a><br>
- <a href="http://www.google.com">Tulip Production</a><br>
</span>
<div class="menutitle style2 style2" onclick="SwitchMenu('sub6')">Art pieces at museum</div>
<span class="submenu style2" id="sub6">
- <a href="http://www.javascriptkit.com">Photos, Estimated Values</a><br>
- <a href="http://www.freewarejava.com">People of Holland</a><br>
</span>
<div class="menutitle style2 style2" onclick="SwitchMenu('sub7')">Contact</div>
<span class="submenu style2" id="sub7">
- <a href="http://www.javascriptkit.com">Contact</a><br>
</span>
</div>
</body>
</html>
Ik hoop echt dat dit duidelijk is voor jullie. Mocht je het weten vertel me dan aub hoe/wat en waar ik het moet zetten. Sorry voor dit gemak btw
Groetjes |
