---
title: "Hjälp med dynamisk meny."
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/96184-hjälp-med-dynamisk-meny"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "dahlgren79"
published: "2004-01-31T00:53:16.000Z"
updated: "2004-02-02T17:53:26.000Z"
replies: 4
views: 401
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/96184-hjälp-med-dynamisk-meny"
---

# Hjälp med dynamisk meny.

## #1 — dahlgren79, 2004-01-31T00:53Z

Hittade ett menyexempel på en sida, men jag undrar om det går att modifiera detta lite? <http://w1.510.telia.com/~u51010287/meny.html> 

1\. Går det att få en underline på menyalternativen när man för musen över textraderna?

2\. Går det att byta ut textraderna till bilder istället. Lägga bild med onmouseover-funktion på 1:a menyalternativen (avdelning 1, 2 o.s.v) 
Funkar det med detta scriptet?

Tänk er menyn på denna sidan, 
<http://home.swipnet.se/folkesson/priser.htm>  fast med textbaserade undermenyer med "underline on hover"....en sån meny vill jag ha. :) 

Jättetacksam om ni skulle vilja hjälpa mej med detta.

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

## #2 — Peter S, 2004-02-01T19:28Z

Hej och välkommen till webForum!

[Exempel](http://member.webforum.nu/Peter%20S/index.html):

```
<!DOCTYPE html PUBLIC"-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<head>

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<title></title>

<style type="text/css">

#menu{
    font: small verdana;
}

#menu ul{
    display: none;
    list-style: none;
    margin: 0;
    padding: 0 0 0 20px;
}

#menu ul li a{
    text-decoration: none;
}

#menu ul li a:hover{
    text-decoration: underline;
}

</style>

<script type="text/javascript">

var imgArr = [
    "mo_r.gif",
    "ha_r.gif",
    "ny_r.gif",
    "pr_r.gif",
    "ro_r.gif",
    "mo.gif",
    "ha.gif",
    "ny.gif",
    "ro.gif"
], aLen = imgArr.length;

while ( aLen-->0 ) ( new Image() ).src = imgArr[aLen];

function fnShowHide(obj) {
    if ( typeof obj.nextSibling == "undefined" || typeof obj.nodeName == "undefined" )
	location.href = obj.href;

    var elm = null;
    while ( (elm = obj.nextSibling).nodeName != "UL" )
	obj = obj.nextSibling;

    elm.style.display = ( elm.style.display == "block" ) ? "none" : "block";

    return false;
}

function fnMouseEffect(obj, img) {
    if ( typeof obj.childNodes != "object" ) return;

    var elm = null, iLen = obj.childNodes.length;
    while ( (elm = obj.childNodes[ --iLen ]).nodeName != "IMG" );

    if ( !elm ) return;

    elm.src = img;
}

</script>

</head>

<div id="menu">
    <a href="avdelning1.html" onmouseover="fnMouseEffect( this, 'mo_r.gif' )" onmouseout="fnMouseEffect( this, 'mo.gif' )" onclick="return fnShowHide( this )"><img src="mo.gif" height="15" width="104" border="0" alt="Avdelning 1"></a><br>

    <ul>
	<li><a href="">Länk 1</a></li>
    	<li><a href="">Länk 2</a></li>
    	<li><a href="">Länk 3</a></li>
    </ul>
    <a href="avdelning2.html" onmouseover="fnMouseEffect( this, 'ha_r.gif' )" onmouseout="fnMouseEffect( this, 'ha.gif' )" onclick="return fnShowHide( this )"><img src="ha.gif" height="15" width="104" border="0" alt="Avdelning 2"></a><br>
    <ul>

	<li><a href="">Länk 1</a></li>
    	<li><a href="">Länk 2</a></li>
    	<li><a href="">Länk 3</a></li>
    </ul>
    <a href="avdelning3.html" onmouseover="fnMouseEffect( this, 'ny_r.gif' )" onmouseout="fnMouseEffect( this, 'ny.gif' )" onclick="return fnShowHide( this )"><img src="ny.gif" height="15" width="104" border="0" alt="Avdelning 3"></a><br>
    <ul>
	<li><a href="">Länk 1</a></li>

    	<li><a href="">Länk 2</a></li>
    	<li><a href="">Länk 3</a></li>
    </ul>
    <a href="avdelning4.html"><img src="pr_r.gif" height="15" width="104" border="0" alt="Avdelning 4"></a><br>
    <a href="avdelning5.html" onmouseover="fnMouseEffect( this, 'ro_r.gif' )" onmouseout="fnMouseEffect( this, 'ro.gif' )" onclick="return fnShowHide( this )"><img src="ro.gif" height="15" width="104" border="0" alt="Avdelning 5"></a><br>
    <ul>
	<li><a href="">Länk 1</a></li>

    	<li><a href="">Länk 2</a></li>
    	<li><a href="">Länk 3</a></li>
    </ul>
</div>
<div>-------------------------------------------------------</div>
```

 :)

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

## #3 — dahlgren79, 2004-02-02T13:34Z

Du är ju helt underbar.... TACK !!!  :)

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

## #4 — nitro2k01, 2004-02-02T15:31Z

Jag säger också välkommen. Som ny medlem på wF kan jag tipsa om funktionen "acceptera som slutgiltigt svar" som finns bredvid varje svar och gör det lätt för andra att se om frågan har fått en lösning. Och ha en bra dag!  ;)

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

## #5 — dectgap, 2004-02-02T17:53Z

Ett litet tips, **dahlgren79**:
Det är [**Peter S'** svar](http://www.webforum.nu/showthread.php?s=&postid=791164#post791164) som innehåller lösningen och som därför ska markeras som accepterat svar ;)

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

---

Tråden på webben: https://www.webforum.nu/amne/javascript/96184-hjälp-med-dynamisk-meny
