Skift baggrund OG tekst ved mouseover

Jeg har lavet et eksempel der virker, og skrevet kommentarer så du kan finde rundt i koden.

Jeg har også skrevet dine funktioner om, så du ikke skal ind og rette i dem manuelt for hver TD felt. Der er et array nederst, hvor du kan tilføje det onmouseover/out tekst du skal bruge.

Men prøv at kig på det og spørg hvis det er :)

<script language="JavaScript">
var t; // variablen til at holde timeout events
function td_hover(e) { // funktion til at køre onmouseover/out events
    if (link_hover == 0) { // er vi på et link?
        t = setTimeout(function(){changeText(e)},50); // timeout på hover event, så vi kan slukke for den igen, hvis det er et link vi er over
    }
}

function changeText(e) { // funktion til at ændre teksten
    current_class = e.className; // hvilken klasse er vi på?
    if(current_class == 'off') { // vi er off og skal on
        e.className='on';
        e.innerHTML = mouse_events[e.id+'_over']; // hent tekst fra array
        var children = e.getElementsByTagName('a');
   
        for (var i=0; i<children.length; i++) { // håndter onmouseover/out events på eventuelle links i teksten
            children[i].onmouseover = setLinkHover;
            children[i].onmouseout = setLinkHover;
        }

    } else { // vi er on og skal off
        e.innerHTML = mouse_events[e.id+'_out']; // onmouseout tekst fra array
        e.className='off';
    }
}

var link_hover = 0;
function setLinkHover() { // håndter onmouseover/out på links
    clearTimeout(t); // fjern vores timeout

    // håndter variabler til at styre om vi er på et link
    if (link_hover == 0) link_hover = 1;
    else link_hover = 0;
}

// tekst indhold til onmouseover/out. format: ID_over - ID_out
var mouse_events = [];
mouse_events['udd_over'] = '<a href="gsdg">Menu 1</a><br>Menu 2<br>Menu 3';
mouse_events['udd_out'] = 'Uddannelse';
</script>
<style>
td.off {
    background-image:url(images/gray-box.gif);
    height:105px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:10pt;
}

td.on {
    background-image:url(images/box-red.gif);
    height:105px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:10pt;
}
</style>
<table border=1>
    <tr>
        <td width="180" class="off" onmouseover="td_hover(this);" onmouseout="td_hover(this);" id="udd">Dette er en test</td>
    </tr>
</table>

Det ville være rart hvis du fulgte op på det når man nu har brugt tid at hjælpe dig.......