Notifikationer

Markér alle som læst Log ud

medievil Nybegynder

17. januar 2003 - 21:00 Der er 14 kommentarer og
1 løsning

Tree menu som lukker når ny undermenu åbnes !

Hej !

jeg ved dette spørgsmål har været her før men jeg syntes ikke rigtig at få svar ! Jeg har downloadet menuen fra rolator, den virker fint men jeg ville gerne have at når man åbner en ny undermenu så lukker den gamle !

Men uden at tilføje alle lag navne til filen: menuscript.js

på forhånd tak...

Synes godt om

cdc Novice

17. januar 2003 - 21:27 #1

Hvad med denne: http://www.peterelkjaer.dk/exp/skiftklasse.html ?

Synes godt om

medievil Nybegynder

17. januar 2003 - 21:47 #2

Tjo, hvor kan man downloade den? Det ville være federe hvis den fra rolator.dk kunne blive lavet om istedet ! Eller hvis den menu der bare bruger samme funktion så er det også ok !

Synes godt om

cdc Novice

17. januar 2003 - 21:59 #3

kender ikke din menu men den er her: http://www.eksperten.dk/spm/291694 der inde ligger der en zipfil du kan downloade

Synes godt om

medievil Nybegynder

17. januar 2003 - 22:02 #4

Jeg har kigget på koden, og jeg fatter ikke så meget af det :o)

her er koden:
function lag(lagnavn, bil) // IE4+
{
if (document.all[lagnavn].style.display == 'none') {
document.all[lagnavn].style.display = 'block';
} else {
document.all[lagnavn].style.display = 'none';
}
}

function menu(action, menunavn)
{
if (action == "over") { document.all[menunavn].style.backgroundColor = "";}
if (action == "out") { document.all[menunavn].style.backgroundColor = ""; }
}

function skift(hvor, farve)
{
// husk # i kald til funktion
hvor.style.backgroundColor = farve;
}

Synes godt om

josini Nybegynder

17. januar 2003 - 22:56 #5

Eller du kan bruge denne:

<HTML>
<HEAD>
<SCRIPT>
constMaxItem=3; // Hvor mange hovedpunkter har du

function fnDispThis(active)
{
for (i=1; i < constMaxItem+1; i++)
{
if (i!=active)
{
document.all["sub"+i].style.display="NONE"
}
else
{
if (document.all["sub"+active].style.display=="") {
document.all["sub"+active].style.display="NONE"
}
else {
document.all["sub"+active].style.display=""

}
}
}
}

</SCRIPT>
</HEAD>
<BODY>
<H1>Overskrift</H1>
<TABLE>
<TR><TD onclick="fnDispThis(1);" style="Cursor:HAND;">Menu 1
<DIV id="sub1" style="Display:'NONE';">
<TABLE cellspacing=2 cellpadding=2>
<TR><TD>•</TD><TD><A href="#" onmouseover="window.status='Menu 1-1';return true"

onmouseout="window.status='';return true";>Menu 1-1</A></TD></TR>
<TR><TD>•</TD><TD><A href="#" onmouseover="window.status='Menu 1-2';return true"

onmouseout="window.status='';return true";>Menu 1-2</A></TD></TR>
<TR><TD>•</TD><TD><A href="#" onmouseover="window.status='Menu 1-3';return true"

onmouseout="window.status='';return true";>Menu 1-3</A></TD></TR>
</TABLE></DIV></TD></TR>

<TR><TD onclick="fnDispThis(2);" style="Cursor:HAND;">Menu 2
<DIV id="sub2" style="Display:'NONE';">
<TABLE cellspacing=2 cellpadding=2>
<TR><TD>•</TD><TD><A href="#" onmouseover="window.status='Menu 2-1';return true"

onmouseout="window.status='';return true";>Menu 1-1</A></TD></TR>
<TR><TD>•</TD><TD><A href="#" onmouseover="window.status='Menu 2-2';return true"

onmouseout="window.status='';return true";>Menu 1-2</A></TD></TR>
<TR><TD>•</TD><TD><A href="#" onmouseover="window.status='Menu 2-3';return true"

onmouseout="window.status='';return true";>Menu 1-3</A></TD></TR>
</TABLE></DIV></TD></TR>

<TR><TD onclick="fnDispThis(3);" style="Cursor:HAND;">Menu 3
<DIV id="sub3" style="Display:'NONE';">
<TABLE cellspacing=2 cellpadding=2>
<TR><TD>•</TD><TD><A href="#" onmouseover="window.status='Menu 3-1';return true"

onmouseout="window.status='';return true";>Menu 1-1</A></TD></TR>
<TR><TD>•</TD><TD><A href="#" onmouseover="window.status='Menu 3-2';return true"

onmouseout="window.status='';return true";>Menu 1-2</A></TD></TR>
<TR><TD>•</TD><TD><A href="#" onmouseover="window.status='Menu 3-3';return true"

onmouseout="window.status='';return true";>Menu 1-3</A></TD></TR>
</TABLE></DIV></TD></TR>
</TABLE>
</BODY>
</HTML>

Ovenstående er en tilpasset udgave af Expand - Collapse fra viewsource.dk

Synes godt om

josini Nybegynder

17. januar 2003 - 23:05 #6

Kan ses i funktion på http://div.josini.dk/menu.htm

Synes godt om

olebole Juniormester

18. januar 2003 - 14:58 #7

<ole>

medievil >> Hvordan i alverden skulle vi kunne vide, hvordan din menu ser ud? :D
Prøv med en URL, f.eks.

/mvh
</bole>

Synes godt om

medievil Nybegynder

19. januar 2003 - 18:48 #8

Sorry jeg først skriver nu !

Det er den samme menu som der er på http://www.rolator.dk

Synes godt om

olebole Juniormester

19. januar 2003 - 19:28 #9

Skal den kun virke i IE ...?

Synes godt om

medievil Nybegynder

19. januar 2003 - 20:33 #10

Øhh nej ! Virker den menu kun i det da?

Synes godt om

medievil Nybegynder

19. januar 2003 - 20:33 #11

Jeg er den ikke den størte Javascript nørd !

Synes godt om

olebole Juniormester

20. januar 2003 - 01:01 #12

Jeg har gravet denne her frem, som jeg har skrevet til et par kurser, jeg holdt i efteråret. Den er kommenteret lidt, så den skulle være til at hitte ud af.
Du skal bruge to billeder 'arr_o.gif' og 'arr_c.gif' - 'o' for 'open' og 'c' for 'closed'. Jeg brugte et par små pile (pegende mod højre henholdsvis ned) på 13*13 pixels, men du kan jo også bruge et '+' og et '-'.

Når du tilføjer nye menupunkter skal du blot rette disse:
1. onclick="toggle(1)"
2. name="pil_1"
3. id="txt_1"

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>  ..:: Menu 2 ::..    </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
td {
font-family: verdana;
font-size: 11px;
}
.pil {
cursor: hand;
cursor: pointer;
}
a.menu {
font-size: 10px;
color: #ff0000;
text-decoration: none;
}
a.menu:visited {
color: #ff0000;
text-decoration: none;
}
a.menu:hover {
font-size: 10px;
color: #ff0000;
text-decoration: underline;
}
</style>
<script type="text/JavaScript">
/********************************************************************
Variablen 'actMen' refererer til den - til enhver tid - aktive menu.
********************************************************************/
var actMen, d=document; actMen=false;

function toggle(inx) {
var tr, img;
if (actMen) { // Vi folder den aktive menu sammen, hvis der er en
d.getElementById("txt_"+actMen).style.display = "none";
d.images["pil_"+actMen].src = "arr_c.gif";
}
if (actMen!=inx) { // Vi folder den nye menu ud
d.getElementById("txt_"+inx).style.display = "block";
d.images["pil_"+inx].src = "arr_o.gif";
actMen = inx;
}
else actMen = false; // Hvis der klikkes på den åbne (aktive) menu
}
</script>
</head>
<body>

<table style="width:200px;" cellspacing="0" cellpadding="0" border="0">

<tr class="pil" onclick="toggle(1)">
<td style="width:15px;"><img src="arr_c.gif" name="pil_1"></td>
<td>Punkt 1</td>
</tr>
<tr id="txt_1" style="display:none;">
<td> </td>
<td>
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td> </td>
<td><a class="menu" href="#">LINK 1</a></td>
</tr>
<tr>
<td> </td>
<td><a class="menu" href="#">LINK 2</a></td>
</tr>
<tr>
<td> </td>
<td><a class="menu" href="#">LINK 3</a></td>
</tr>
</table>
</td>
</tr>


<tr class="pil" onclick="toggle(2)">
<td><img src="arr_c.gif" name="pil_2"></td>
<td>Punkt 2</td>
</tr>
<tr id="txt_2" style="display:none;">
<td> </td>
<td>
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td> </td>
<td><a class="menu" href="#">LINK 4</a></td>
</tr>
<tr>
<td> </td>
<td><a class="menu" href="#">LINK 5</a></td>
</tr>
</table>
</td>
</tr>

</table>

</body>
</html>

Den er også NS6+ kompatibel :)
/mvh

Synes godt om

medievil Nybegynder

13. februar 2003 - 21:45 #13

Uhh den kunne jeg godt bruge ! sorry det tog så lang tid...

Synes godt om

johnstigers Seniormester

07. marts 2003 - 11:34 #14

oooooooleboooole!!!

http://www.eksperten.dk/spm/325577 - en opgave til dig :)

Synes godt om

mariay Nybegynder

12. juni 2003 - 13:13 #15

Hej Olebole. Den der menu er helt kanon, den kan jeg også bruge. Jeg har bare lige et spørgsmål. Det ser ud som om pilene vender forkert ved start, men når man så har åbnet og lukket et menupunkt står de rigtigt?? Kan der gøres noget ved det?

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript	5	27/04/202620:09	21/08/202610:41
Validering af filnavn i formular Af Strawberry i JavaScript	8	14/04/202610:11	20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript	2	03/02/202614:19	04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript	9	18/04/202516:52	22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript	2	14/02/202511:47	27/06/202514:34

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS