div postition changing onmouseout

[pbwbart]

Ik heb een javascript gemaakt met dat aangeroepen wordt bij onmouseover en onmouseout. Nou werk ik ook met position : absolute. Het enige probleem is dat de onmouseout functie niet geld voor de nieuwe positie van het div element maar voor de oude waardoor de onmouseout functie te snel aangeroepen wordt.
Hieronder mijn script. Kan iemand mij vertellen wat ik aan moet passen?

<script>
function pageX(element)
{
  var x = 0;
  do 
  {
    if (document.getElementById(element).style.position == 'absolute') 
    {
      return x + document.getElementById(element).offsetLeft; 
    }
    else
    {
      x += document.getElementById(element).offsetLeft;
      if (document.getElementById(element).offsetParent) 
        if (document.getElementById(element).offsetParent.tagName == 'TABLE') 
          if (parseInt(document.getElementById(element).offsetParent.border) > 0)
          {
            x += 1; 
          }
    }
  }
  while ((element = document.getElementById(element).offsetParent));
  return x; 
}

var active = 0;
function languagemouseover(divid)
{
 if (active == 0)
  { 
  document.getElementById(divid).style.width="200px";
  document.getElementById(divid).style.left=pageX(divid) - 180;
  document.getElementById(divid).innerHTML="<TABLE  style='WIDTH: 200px; BORDER-COLLAPSE: collapse' borderColor=#ffffff cellSpacing=0 cellPadding=0 border=1> <TBODY><TR><TD align=right>Dutch / Nederlands&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<IMG height=13  src='/images/NL.jpg' width=20  border=0><TD></TR><TR><TD> <A href='/basis.aspx?Tid=2'  target=_self><IMG style='BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px' src='/upload/5nl.jpg?w=20' border=0> &nbsp;&nbsp;&nbsp;&nbsp;Nederland</A></TD></TR> <TR> <TD ><A href='/basis.aspx?Tid=4' target=_self><IMG style='BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px' src='/upload/4be.jpg?w=20'  border=0> &nbsp;&nbsp;&nbsp;&nbsp;België</A></TD></TR></TBODY></TABLE>";
active =1;
}
}
function languagemouseoutstart(divid)
{
  setTimeout("languagemouseout('" + divid + "')", 1000);
}
function languagemouseout(divid)
{
  document.getElementById(divid).style.width="20px";
  document.getElementById(divid).style.left="";
  document.getElementById(divid).innerHTML="<IMG height=13  src='/images/NL.jpg' width=20  border=0> "
  active=0;
}

</script>
<DIV id=divlanguage onmouseover=languagemouseover(this.id) style="WIDTH: 20px; POSITION: absolute; BACKGROUND-COLOR: black" onmouseout=languagemouseoutstart(this.id) align=right valign="top"><IMG height=13 alt="" src="/images/NL.jpg" width=20 border=0> </DIV>

 

[JP Romijn]

Ik geloof dat je een 'custom dropdown' wil maken om een taal te kiezen?

Wanneer je met mouseover en mouseout werkt kan het te maken hebben met event bubbling .

Je kan event bubbling uitschakelen, je kunt ook kijken welk element de functie aanroept en alleen bij bepaalde elementen de functie uit laten voeren.

 

[pbwbart]

bedankt voor de hulp,
Ik heb het probleem opgelost met
clearTimeout(timer);