Jeg fandt et lille script her inde, som jeg gør god brug af.
Jeg er ny i CSS og JavaScript verden, så jeg søger lidt hjælp.
<html>
<head>
<title>Vis og skjul layers</title>
<script type="text/javascript">
function show(layer_id)
{
//tilgår layer egenskaber for NN4 visibility sættes til show
if (document.layers)
document.layers[layer_id].visibility='show';
//tilgår layer egenskaber for IE4 visibility sættes til visible
else if (document.all)
document.all[layer_id].style.visibility='visible';
//tilgår layer egenskaber for IE5+, NN6+, Opera og Mozila visibility sættes til visible
else
document.getElementById(layer_id).style.visibility='visible';
}
//funktionen der skjuler et layer modtager parameteren layer_id
function hide(layer_id)
{
//tilgår layer egenskaber for NN4 visibility sættes til hide
if (document.layers)
document.layers[layer_id].visibility='hide';
//tilgår layer egenskaber for IE4 visibility sættes til hidden
else if (document.all)
document.all[layer_id].style.visibility='hidden';
//tilgår layer egenskaber for IE5+, NN6+, Opera og Mozila visibility sættes til hidden
else
document.getElementById(layer_id).style.visibility='hidden';
}
//Slut på scriptkode
</script>
<style type="text/css">
<!--Her laves stylesheetet, hvert id skal have et unikt navn-->
layer-id-1
{
border-style:solid;
position:absolute;
width:100px;
height:20px;
border-style:solid;
visibility:hidden;
}
<!--Slut på stylesheetet-->
</style>
</head>
<body>
<!--Funktions kald i onclick event og knapper til at vise eller skjule et layer
Parameterer overføres til show og hide funktionerne i form af et layer-id-->
<a href="test.htm" onMouseOver="show('layer-id-1')">Test</a> || <a href="test.htm" onMouseOver="show('layer-id-2')">Test</a> || <a href="test.htm" onMouseOver="show('layer-id-3')">Test</a>
<div id="layer-id-1" style="border-style:solid; width:10%; height:auto; position:absolute; border-color:#000099;" onClick="hide('layer-id-1')">
<a href="test.htm">Test</a><br>
<a href="test.htm">Test</a><br>
<a href="test.htm">Test</a><br>
Klik her for luk
</div>
<div id="layer-id-2" style="border-style:solid; width:10%; height:auto; position:absolute; border-color:#000099;" onClick="hide('layer-id-2')">
<a href="test.htm">Test</a><br>
<a href="test.htm">Test</a><br>
<a href="test.htm">Test</a><br>
Klik her for luk
</div>
<div id="layer-id-3" style="border-style:solid; width:10%; height:auto; position:absolute; border-color:#000099;" onClick="hide('layer-id-3')">
<a href="test.htm">Test</a><br>
<a href="test.htm">Test</a><br>
<a href="test.htm">Test</a><br>
Klik her for luk
</div>
</body>
</html>Problemet er så at div boksene bliver vist oven på hinanden, hvor de skal vises EFTER hinanden
Hvordan gør jeg så det?
Indlæg senest redigeret d. 19.02.2007 23:58 af Bruger #6586