---
title: "Hittar inte felet i expanderande meny - snälla hjälp!"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/144578-hittar-inte-felet-i-expanderande-meny-snälla-hjälp"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "xenia"
published: "2006-03-25T22:09:18.000Z"
updated: "2006-03-25T22:09:18.000Z"
replies: 0
views: 432
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/144578-hittar-inte-felet-i-expanderande-meny-snälla-hjälp"
---

# Hittar inte felet i expanderande meny - snälla hjälp!

## #1 — xenia, 2006-03-25T22:09Z

Hej!
Jag har sökt med ljus och lykta genom nätet för att få hjälp med en expanderande meny. Nu har jag börjat få ihop något - men inte sjutton expanderar den! Den gjorde det precis i början (jag var överlycklig!) men så la jag till css-filen och ändrade lite och då försvann expanderingen...  :q 

Finns någon som har lust att hjälpa mig?
 här kommer min HTML fil:
\<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"\>
\<html\>
\<head\>
\<title\>Untitled Document\</title\>
\<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"\>
\<link rel="stylesheet" href="hovercss.css" type="text/css"\>
\<script type="text/javascript" src="expandingMenu.js"\>\</script\>
\</head\>

\<body\>
\<div id="menu"\>
\<ul\>
  \<li\>\<a href="#"\>Menu Item 1\</a\>\</li\>
    \<ul\>
      \<li\>\<a href="#"\>Sub Item 1.1\</a\>\</li\>
      \<li\>\<a href="#"\>Sub Item 1.2\</a\>\</li\>
      \<li\>\<a href="#"\>Sub Item 1.3\</a\>\</li\>
    \</ul\>
  \</li\>
  \<li\>Menu Item 2
    \<ul\>
      \<li\>\<a href="#"\>Sub Item 2.1\</a\>\</li\>
      \<li\>\<a href="#"\>Sub Item 2.2\</a\>\</li\>
      \<li\>\<a href="#"\>Sub Item 2.3\</a\>\</li\>
    \</ul\>
  \</li\>
  \<li\>Menu Item 3
    \<ul\>
      \<li\>\<a href="#"\>Sub Item 3.1\</a\>\</li\>
      \<li\>\<a href="#"\>Sub Item 3.2\</a\>\</li\>
      \<li\>\<a href="#"\>Sub Item 3.3\</a\>\</li\>
    \</ul\>
  \</li\>
  \<li\>Menu Item 4
    \<ul\>
      \<li\>\<a href="#"\>Sub Item 4.1\</a\>\</li\>
      \<li\>\<a href="#"\>Sub Item 4.2\</a\>\</li\>
      \<li\>\<a href="#"\>Sub Item 4.3\</a\>\</li\>
    \</ul\>
  \</li\>
  \<li\>Menu Item 5
    \<ul\>
      \<li\>\<a href="#"\>Sub Item 5.1\</a\>\</li\>
      \<li\>\<a href="#"\>Sub Item 5.2\</a\>\</li\>
      \<li\>\<a href="#"\>Sub Item 5.3\</a\>\</li\>
    \</ul\>
  \</li\>
\</ul\>\</div\>
\<p\>\<div align="center"\>
\<font face="arial, helvetica" size"-2"\>Free JavaScripts provided\<br\>
by \<a href="http://javascriptsource.com"\>The JavaScript Source\</a\>\</font\>
\</div\>\<p\>

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

här kommer min css fil
/\* CSS Document \*/
/\* bredd på menyn 150
ingen marginal el padding runt boxen
 \*/
\#menu
{
width: 150px;
margin: 0;
padding: 0;
font: 11px Verdana, Arial, Helvetica, sans-serif;
}

/\* inge listpunkter
7px marg under listan skapar mellanrum till nästa rubrik
ingen padding\*/
\#menu ul
{
list-style-type: none;
margin: 0 0 7px 0;
padding: 0;
}
/\* ingen marginal el padding
varje länkbox inom li skall ha en linje till höger, under och till vänster
\*/
\#menu li
{
margin: 0;
padding: 0;
border-right: 1px solid #aaab9c;
border-bottom: 1px solid #aaab9c;
border-left: 1px solid #aaab9c;
}
/\* alla länkar i listan visas som block
ingen marginal
padding runt länktext top&bott, right&left
bakgrundsbild 
ingen understrykning på länkarna\*/
\#menu a, #menu span
{
display: block;
margin: 0;
padding: 5px 10px;
background-image:  url(../menytest/iframe%20test/meny%20med%20hover/meny_bg.gif);
color: #000000;
text-decoration: none;
}
/\* gäller endast aktuell sida - text i fetstil\*/
\#menu span#aktuell { font-weight: bold; }
/\* visas som block, pädding, bild, textfärg\*/
\#menu a:hover
{
display: block;
padding: 5px 10px;
background-image:  url(../menytest/iframe%20test/meny%20med%20hover/meny_over.gif);
color: #333333;
}
/\* visas som block, ingen marginal!
padding 5 - 7px åt vänster
bakgrundsbild
ingen fetstil i det här spanblocket
samma kanter som menybox li\*/
\#menu span.rubrik
{
display: block;
margin: 0;
padding: 5px 5px 5px 12px;
background-image:  url(../menytest/iframe%20test/meny%20med%20hover/meny_rubrik.gif);
font-size: 12px;
color: #ffffff;
font-weight: normal;
border-right: 1px solid #aaab9c;
border-bottom: 1px solid #aaab9c;
border-left: 1px solid #aaab9c;
}

här kommer min js-fil
// JavaScript Document
/\* This script and many more are available free online at
The JavaScript Source :: <http://javascript.internet.com>
Created by: Travis Beckham :: <http://www.squidfingers.com> \| <http://www.podlob.com>
version date: 06/02/03 :: If want to use this code, feel free to do so,
but please leave this message intact. (Travis Beckham) \*/

// Node Functions

if(!window.Node){
  var Node = {ELEMENT_NODE : 1, TEXT_NODE : 3};
}

function checkNode(node, filter){
  return (filter == null \|\| node.nodeType == Node\[filter\] \|\| node.nodeName.toUpperCase() == filter.toUpperCase());
}

function getChildren(node, filter){
  var result = new Array();
  var children = node.childNodes;
  for(var i = 0; i \< children.length; i++){
    if(checkNode(children*, filter)) result\[result.length\] = children*;
  }
  return result;
}

function getChildrenByElement(node){
  return getChildren(node, "ELEMENT_NODE");
}

function getFirstChild(node, filter){
  var child;
  var children = node.childNodes;
  for(var i = 0; i \< children.length; i++){
    child = children*;
    if(checkNode(child, filter)) return child;
  }
  return null;
}

function getFirstChildByText(node){
  return getFirstChild(node, "TEXT_NODE");
}

function getNextSibling(node, filter){
  for(var sibling = node.nextSibling; sibling != null; sibling = sibling.nextSibling){
    if(checkNode(sibling, filter)) return sibling;
  }
  return null;
}
function getNextSiblingByElement(node){
        return getNextSibling(node, "ELEMENT_NODE");
}

// Menu Functions & Properties

var activeMenu = null;

function showMenu() {
  if(activeMenu){
    activeMenu.className = "";
    getNextSiblingByElement(activeMenu).style.display = "none";
  }
  if(this == activeMenu){
    activeMenu = null;
  } else {
    this.className = "active";
    getNextSiblingByElement(this).style.display = "block";
    activeMenu = this;
  }
  return false;
}

function initMenu(){
  var menus, menu, text, a, i;
  menus = getChildrenByElement(document.getElementById("menu"));
  for(i = 0; i \< menus.length; i++){
    menu = menus*;
    text = getFirstChildByText(menu);
    a = document.createElement("a");
    menu.replaceChild(a, text);
    a.appendChild(text);
    a.href = "#";
    a.onclick = showMenu;
    a.onfocus = function(){this.blur()};
  }
}

if(document.createElement) window.onload = initMenu;

Mycket tacksam!!!!
//Xenia****

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

---

Tråden på webben: https://www.webforum.nu/amne/javascript/144578-hittar-inte-felet-i-expanderande-meny-snälla-hjälp
