---
title: "Javascriptmeny"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/17757-javascriptmeny"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "Stina"
published: "2001-05-16T10:34:00.000Z"
updated: "2001-05-17T11:32:00.000Z"
replies: 5
views: 136
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/17757-javascriptmeny"
---

# Javascriptmeny

## #1 — Stina, 2001-05-16T10:34Z

Är det någon som vet hur man ska göra för att denna ska funka även i Netscape.

HTML kod:

\<html\>
\<head\>
\<title\>Menu\</title\>

\<script language="Javascript"\>
\<!--
var currentTopic = 0;
var originalTopic = 0;
var lonePicks = "#1#"
var loneHeaderVal = "#" + currentTopic + "#";

function reveal(id)
{
    if (ver4Verify)
	{
        if (document.all\["topic" + id\].style.display == "")
		{
            // Current topics is visible... turn invisible
            document.all\["topic" + id\].style.display = "none";
            currentTopic = 0;
        }
        else
		{
            // Current topic is invisible... turn visible... hide all other
            if (currentTopic != 0)
			{
                // Hide other visible topic
                loneHeaderVal = "#" + currentTopic + "#";
                if (lonePicks.indexOf(loneHeaderVal) == -1)
				{
                    document.all\["topic" + currentTopic\].style.display = "none";
                }
                else
				{
					loneHeaderVal = "#0#";
				    if (lonePicks.indexOf(loneHeaderVal) == -1)
					{
                    	document.all\["topic" + currentTopic\].style.display = "none";
					}
				}
            }
            document.all\["topic" + id\].style.display = "";
            currentTopic = id;
            loneHeaderVal = "#" + currentTopic + "#";
        }
    }
}
//--\>
\</script\>

\<script language="Javascript"\>
\<!--
function ver4Verify() {
 if (navigator.appVersion.indexOf("4.") != -1) {
  return true;
 }
 else
 {
  return false;
 }
}
//--\>
\</script\>
\</head\>

\<body\>

\<!--Länk 1 --\>

\<table cellpadding="0" cellspacing="0"\>
	\<div id="link1"\>
	\<tr\>
		\<td valign="center" height=20\>\<A class="IE4Selectedclass" href=""\>
		\<td valign=center\>\<A class="IE4Linkclass" href="javascript:reveal(1)"\>Länk 1\</a\>\</td\>
	\</tr\>
	\</div\>
\</table\>
	
\<div id="topic1" style="display: none" class="IE4divMargin"\>
\<A class=IE4subtopicclass href="#"\>Länk 1.1\</a\>\<br\>
\<A class=IE4subtopicclass href="#"\>Länk 1.2\</a\>\<br\>
\<A class=IE4subtopicclass href="#"\>Länk 1.3\</a\>\<br\>
\<A class=IE4subtopicclass href="#"\>Länk 1.4\</a\>\<br\>
\<A class=IE4subtopicclass href="#"\>Länk 1.5\</a\>\<br\>
\<A class=IE4subtopicclass href="#"\>Länk 1.6\</a\>\<br\>
\</div\>
	
	
\<!-- Länk 2 --\>
	
\<table cellpadding="0" cellspacing="0"\>
	\<div id="link2"\>
	\<tr\>
		\<td valign="center" height=20\>\<A class="IE4Selectedclass" href=""\>
		\<td valign=center\>\<A class="IE4Linkclass" href="javascript:reveal(2)"\>Länk 2\</a\>\</td\>
	\</tr\>
	\</div\>
\</table\>
	
\<div id="topic2" style="display: none" class="IE4divMargin"\>
\<A class=IE4subtopicclass href="#"\>Länk 2.1\</a\>\<br\>
\<A class=IE4subtopicclass href="#"\>Länk 2.2\</a\>\<br\>
\<A class=IE4subtopicclass href="#"\>Länk 2.3\</a\>\<br\>
\<A class=IE4subtopicclass href="#"\>Länk 2.4\</a\>\<br\>
\<A class=IE4subtopicclass href="#"\>Länk 2.5\</a\>\<br\>
\<A class=IE4subtopicclass href="#"\>Länk 2.6\</a\>\<br\>
\</div\>

\</body\>
\</html\>

Permalänk: https://www.webforum.nu/p/17757

## #2 — Johnsen, 2001-05-16T10:54Z

Eftersom display är IE-specifikt går det inte att göra på det viset för att flytta lager i andra läsare. Jag gjorde ett litet test på en variant för en tid sedan, du kan ju se om det är något att ha: <http://www.host4u.d2g.com/johnsen/tmen.html> 

\------------------
\- J-O-H-N-S-E-N -

Permalänk: https://www.webforum.nu/p/333133

## #3 — Jojoxx, 2001-05-16T11:10Z

Nja... display ingår faktiskt i CSS-standarden ([CSS Level 2 - display](http://www.w3.org/TR/REC-CSS2/visuren.html#propdef-display)), men Netscape 4.x stödjer inte dynamisk rendering (rendera om sidan efter det att den laddats). Men Netscape 6, och andra DOM1 kompatibla läsare kan använda det.

Lite modifikation

```
<html>
<head>
<title>Menu</title>

<script language="Javascript">
<!--
var currentTopic = 0;
var originalTopic = 0;
var lonePicks = "#1#"
var loneHeaderVal = "#" + currentTopic + "#";

function reveal(id) {
	if (document.all) {
		if (document.all["topic" + id].style.display == "") {
			// Current topics is visible... turn invisible
			document.all["topic" + id].style.display = "none";
			currentTopic = 0;
		} else {
			// Current topic is invisible... turn visible... hide all other
			if (currentTopic != 0) {
				// Hide other visible topic
				loneHeaderVal = "#" + currentTopic + "#";
				if (lonePicks.indexOf(loneHeaderVal) == -1) {
					document.all["topic" + currentTopic].style.display = "none";
				} else {
					loneHeaderVal = "#0#";
					if (lonePicks.indexOf(loneHeaderVal) == -1) {
						document.all["topic" + currentTopic].style.display = "none";
					}
				}
			}
			document.all["topic" + id].style.display = "";
			currentTopic = id;
			loneHeaderVal = "#" + currentTopic + "#";
		}
	} else if (document.getElementById) {
		if (document.getElementById("topic" + id).style.display == "") {
			// Current topics is visible... turn invisible
			document.getElementById("topic" + id).style.display = "none";
			currentTopic = 0;
		} else {
			// Current topic is invisible... turn visible... hide all other
			if (currentTopic != 0) {
				// Hide other visible topic
				loneHeaderVal = "#" + currentTopic + "#";
				if (lonePicks.indexOf(loneHeaderVal) == -1) {
					document.getElementById("topic" + currentTopic).style.display = "none";
				} else {
					loneHeaderVal = "#0#";
					if (lonePicks.indexOf(loneHeaderVal) == -1) {
						document.getElementById("topic" + currentTopic).style.display = "none";
					}
				}
			}
			document.getElementById("topic" + id).style.display = "";
			currentTopic = id;
			loneHeaderVal = "#" + currentTopic + "#";
		}
	}
}
//-->
</script>
</head>

<body>

<!--Länk 1 -->

<table cellpadding="0" cellspacing="0">
<div id="link1">
<tr>
<td valign="center" height=20><A class="IE4Selectedclass" href="">
<td valign=center><A class="IE4Linkclass" href="javascript:reveal(1)">Länk 1</a></td>
</tr>
</div>
</table>

<div id="topic1" style="display: none" class="IE4divMargin">
<A class=IE4subtopicclass href="#">Länk 1.1</a><br>
<A class=IE4subtopicclass href="#">Länk 1.2</a><br>
<A class=IE4subtopicclass href="#">Länk 1.3</a><br>
<A class=IE4subtopicclass href="#">Länk 1.4</a><br>
<A class=IE4subtopicclass href="#">Länk 1.5</a><br>
<A class=IE4subtopicclass href="#">Länk 1.6</a><br>
</div>

<!-- Länk 2 -->

<table cellpadding="0" cellspacing="0">
<div id="link2">
<tr>
<td valign="center" height=20><A class="IE4Selectedclass" href="">
<td valign=center><A class="IE4Linkclass" href="javascript:reveal(2)">Länk 2</a></td>
</tr>
</div>
</table>

<div id="topic2" style="display: none" class="IE4divMargin">
<A class=IE4subtopicclass href="#">Länk 2.1</a><br>
<A class=IE4subtopicclass href="#">Länk 2.2</a><br>
<A class=IE4subtopicclass href="#">Länk 2.3</a><br>
<A class=IE4subtopicclass href="#">Länk 2.4</a><br>
<A class=IE4subtopicclass href="#">Länk 2.5</a><br>
<A class=IE4subtopicclass href="#">Länk 2.6</a><br>
</div>

</body>
</html>
```

Permalänk: https://www.webforum.nu/p/333134

## #4 — Johnsen, 2001-05-16T11:43Z

Trevligt, man lär sig något nytt varje dag. Inget verkar funka i Opera dock.

Permalänk: https://www.webforum.nu/p/333135

## #5 — nakoz, 2001-05-17T01:05Z

stina: 
kan bara tipsa om en grej som gör din kod lite mer lättläst här på webforum... 
spana in denna: <http://cgi.webforum.nu/wf/ubbcode.html> 

mvh.

Permalänk: https://www.webforum.nu/p/333136

## #6 — Stina, 2001-05-17T11:32Z

Är hemskt tacksam för alla era svar.

Permalänk: https://www.webforum.nu/p/333137

---

Tråden på webben: https://www.webforum.nu/amne/javascript/17757-javascriptmeny