Forum Moderators: not2easy
i haven't tried this yet:
- create an iframe or div with scrolling overflow
- put your styled content in there
- write a js routine to show/hide that div / iframe
- place another div for the select stuff on top
- fill it with js (dom) from the current selection in the show/hide div
- maybe a html list will help you out to modularize the content in the show/hide div (dom access) for easy access for the current selection
so far a lot to do for something which will only work in selected browser with script enabled.
my opinion: stay with select and css and forget about scripts. don't rely on these ugly scripts any longer. for most browsers (ie on top) this is a security issue and everyone should have this turned off except in really trusted sites (like localhost and intranet, but even there this can be very stupid).
--hakre
[code]
<head>
<style type="text/css">
table.menu { position:absolute; visibility:hidden; }
</style>
<script type="text/javascript">
function showmenu(elmnt)
{
document.all(elmnt).style.visibility="visible"
}
function hidemenu(elmnt)
{
document.all(elmnt).style.visibility="hidden"
}
</script>
</head>
<body>
<table>
<tr>
<td onmouseover="showmenu('menu1')" onmouseout="hidemenu('menu1')">
Menu heading text
<table class="menu" id="menu1">
<tr><td>selection 1</td><tr>
<tr><td>selection 2</td></tr>
</table>
</td></tr></table>
It's hack and slash how I put it up and there might be a few typos, but there's a BASIC css menu that i've come across online. it uses mouseover though and I haven't gotten it to work on my mozilla setup. If you are looking for it to validate xhtml strict (as I have tried too), the mouseover on the td fails as well.
If you are intending this for an IE audience though, it does work in my browser. the "selection 1" can be changed to have <a> links in it and images or whatever and you can have many section headers next to each other for a fully functional menu bar with pop-downs.
Hope this wasn't completely off topic.