Expanderande meny

6 svar · 438 visningar · startad av Agneus 29 mars 2005

AgneusMedlem sedan dec. 200346 inlägg

Frågan29 mars 2005 11:01#1

Hej

Har använt detta sätt för att göra expanderande menyer. Men nu har jag upptäckt att det inte funkar i Firefox. Någon som vet varför och hur man kan rätta till det?
Sidan med menyn ligger i ett frameset.

<html>

<head>
<meta http-equiv="Content-Language" content="sv">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title></title>
<base target="main">

<script>
	function menu(obj) {
		if(obj.style.display=='none') {
		obj.style.display=''
		}
		else obj.style.display='none'
	}
</script>

</head>
<body>

<div onclick="menu(menyProd)" style="cursor: hand">
      <a href="Produkten.htm">Produkten</a>
</div>

<div style="display: none" id="menyProd">
      <a href="A.htm">A</a><br>
      <a href="B.htm">B</a>
</div>

</body>
</html>

@ndersMedlem sedan juni 200032 967 inlägg

3 apr. 2005 06:32#2

På vilket sätt fungerar det inte i Firefox?
Jag tycker koden ser ut att funka likadant i IE som i FF.

JojoxxMedlem sedan juni 20004 308 inlägg

3 apr. 2005 09:50#3

Korrekt DOM-kod:

<div onclick="menu(document.getElementById('menyProd'))" style="cursor: hand">

dectgapMedlem sedan sep. 20021 655 inlägg

3 apr. 2005 09:52#4

Du skriver

onclick="menu(menyProd)"

d.v.s. du referar till ett element direkt via dess id.
Det är ingen allmäntfungerande metod, utan fungerar bara i IE.

Det korrekta är att använda sig av document.getElementById().

Testa därför med:

<html>

<head>
<meta http-equiv="Content-Language" content="sv">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title></title>
<base target="main">

<script>
	function menu(objId) {
		var obj = document.getElementById(objId);
		if(obj.style.display=='none') {
		obj.style.display=''
		}
		else obj.style.display='none'
	}
</script>

</head>
<body>

<div onclick="menu('menyProd')" style="cursor: pointer">
      <a href="Produkten.htm">Produkten</a>
</div>

<div style="display: none" id="menyProd">
      <a href="A.htm">A</a><br>
      <a href="B.htm">B</a>
</div>

</body>
</html>

Du skickar alltså elementets id som en sträng, och använder sedan document.getElementById() i funktionen menu() för att utifrån id:t få fram ett element.

Jag ändrade även

style="cursor: hand"

till

style="cursor: pointer"

eftersom det är det "rätta" sättet att skriva för att få fram en hand (=länkpekare).

AgneusMedlem sedan dec. 200346 inlägg

3 apr. 2005 19:04#5

Tack för hjälpen dectgap, nu fungerar det som det ska.

web00132Medlem sedan maj 2001797 inlägg

7 apr. 2005 18:34#6

Men hörni, koden som dectgap skrev funkar inte i IE med SP2. Går det inte att fixa så en kod funkar i båda webbläsarna?

dectgapMedlem sedan sep. 20021 655 inlägg

8 apr. 2005 06:32#7

web00132 skrev:

Men hörni, koden som dectgap skrev funkar inte i IE med SP2. Går det inte att fixa så en kod funkar i båda webbläsarna?

Försöker du testa koden lokalt på din dator? I så fall fungerar det inte i.o.m. SP2.
Om du istället lägger upp det på nätet ska det gå bättre.