skole eksempel på denne menu

<ole>

<style type="text/css">
.cont {
    width: 200px;
    font: 11px verdana, arial, sans-serif;
}
.cont img {
    vertical-align: middle;
}
.cont a {
    font-weight: bold;
    color: #000000;
    text-decoration: none;
}
.cont a:visited {
    color: #000000;
    text-decoration: none;
}
.cont a:hover {
    color: #cc0000;
    text-decoration: none;
}
.cont div {
    margin: 5px 0px 5px 20px;
    background-color: #ededed;
    border: 1px dashed #cccccc;
}
</style>

<script type="text/JavaScript">
function toggle(elm) {
    var idInx = elm.id.split("head_")[1];
    var tDiv = document.getElementById("text_"+idInx)
    var im = document.getElementById("icn_"+idInx);
    tDiv.style.display = (tDiv.style.display=="none")? "block" : "none";
    im.src = (im.src.indexOf("open")!=-1)? "close.gif" : "open.gif";
}
</script>

<div class="cont"><img id="icn_0" src="open.gif">
    <a href="#" id="head_0" onclick="toggle(this);return false">En overskrift</a>
    <div id="text_0" style="display:none">
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
    Nullam tristique risus sed massa lobortis fermentum.
    Sed pretium sem sed ligula. Suspendisse iaculis
    </div>
</div>

<div class="cont"><img id="icn_1" src="open.gif">
    <a href="#" id="head_1" onclick="toggle(this);return false">En anden overskrift</a>
    <div id="text_1" style="display:none">
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
    Nullam tristique risus sed massa lobortis fermentum.
    Sed pretium sem sed ligula. Suspendisse iaculis
    </div>
</div>

Du kan selv hente billederne hos DR  ;o)

/mvh
</bole>

men olebole bliver man så glad - for så kan alt lade sig gøre :-)