Hvorfor skulle inline være bedre end block, når du divs naturlige måde at opføre sig på er at være block-level-tags ?-)
-- og så er freesites ønsker med garanti ikke opfyldt, når der for hver eneste option er både en parent og en child, det skal nok være en parent for hvor gruppe, og så et antal childs inde i ...
-- men udfra freesites oplæg og dit forsøg fik jeg bikset denne sammen:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
<meta name="Generator" content="Stone's WebWriter 4">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="keywords" content="roenving,
http://www.eksperten.dk/spm/634686"><style type="text/css">
html,body{height:100%;margin:0px;border:0px;padding:0px;font-family:tahoma,verdana,arial,sans-serif;font-size:small;}
#menu{width:120px;}
#menu div{background-color:#789;cursor:pointer;color:white;font-weight:900;}
#menu div div{background-color:#abc;display:none;}
#menu div div a:link,#menu div div a:visited{font-weight:400;color:black;text-decoration:none;}
#menu div div a:hover,#menu div div a:active{font-weight:900;text-decoration:underline overline;}
</style>
<script type="text/javascript">
var quote = new Array()
quote[0] = new Array();
quote[0][0] ="Odensevej 1";
quote[0][1]="odensevej 2";
quote[0][2]="odensevej 3";
quote[1] = new Array();
quote[1][0]="nyborgvej 1";
quote[1][1]="nyborgvej 2";
function visSkjul(elm){
var st = elm.getElementsByTagName('div')[0].style;
var actState = st.display;
var num = 0;
while(document.getElementById("menu_" + num)){
document.getElementById("menu_" + num).style.display = 'none';
num++;
}
st.display = actState!='block' ? 'block' : 'none';
}
window.onload = function(){
var menuDiv = document.getElementById("menu"),newPar,newDiv,newLink,newTxt,newLine;
newLine = document.createElement('br');
for(var i=0;quote.length>i;i++){
newPar = document.createElement('div');
newPar.id = "oMenu" + i;
newTxt = document.createTextNode(quote[i][0].split(" ")[0]);//hvor kommer teksten til overdiven ?-)
newPar.appendChild(newTxt);
menuDiv.appendChild(newPar);
newPar.onclick = function(){visSkjul(this);};
newDiv = document.createElement('div');
newDiv.id = "menu_" + i;
for(var j=0;quote[i].length>j;j++){
newLink = document.createElement('a');
newLink.href = "java script:alert('Click på link " + j + " i menu " + i +"');";//hvor kommer links fra ?-)
newLink.onclick = function(){event.cancelBubble = true;};
newTxt = document.createTextNode(quote[i][j]);
newLink.appendChild(newTxt);
newDiv.appendChild(newLink);
newDiv.appendChild(newLine.cloneNode(true));
}
newPar.appendChild(newDiv);
}
}
</script>
<title>Dynamisk menu simpel</title>
</head>
<body>
<div id="menu"></div>
</body>
</html>
-- den skulle så også kunne tåle at blive brugt i xhtml strict-dokumenter, så den er en anelse fremtidsikret ...
-- som det fremgår af et par af kommentarerne mangler der dog nogle væsentlige ting, nemlig overskrift til menupunkter og link (og måske target !-), som klik på punkterne skal reagere med !o]