Problem wenn div mit mouse verlassen dann close

[Struppi]

Ich habe folgendes Problem . Ich erstelle wenn man wohinklickt ein neues div in dem auch andere divs erstellt werden genau über der mausposition wo man hingeklickt hat .
Wenn man nun den Mauszeiger aus dem div herausbewegt soll sich das div schliesen was es auch tut . Nun habe ich aber folgendes Problem .
Ich deklariere ein weiteres div als child von dem div welches ich öffne . es wird in dem Bereich der Elterndivs angezeigt . Es soll später einen Link oder einen funktionsaufruf enthalten .
Wenn ich nun aber über das child div fahre schliest sich mein elterndiv auch . Kann mir da jemand einen Denkanstoß geben , wäre wirklich sehr nett .
Existiert eine Möglichkeit einen onmouseout zu definieren der nur ausgelöst wird wenn man das Element verläst ( die child elemente aber nicht berücksichtigt werden ) ?

Kurz - nein.

Lang ja, eine kurze suche mit google, hat mich auf diese Seite gebracht http://www.thefutureoftheweb.com/blog/2006/2/bursting-the-event-bubble

Die Lösung sieht also so aus:

  
<script type="text/javascript">  
var box = null;  
function show(e)  
{  
    if(box) return;  
  
    var pos = mouse_pos(e);  
    box = document.createElement('div');  
    box.style.position = 'absolute';  
    box.style.backgroundColor = '#fff';  
    box.style.top = ( 2+ pos.top )  + 'px';  
    box.style.left = ( 2 + pos.left ) + 'px';  
    box.style.padding = 25 + 'px';  
    var img = new Image();  
    img.style.position = 'relative';  
    img.style.top = '15px'  
    img.src = 'test.jpg';  
    box.appendChild( img );  
    document.body.appendChild( box);  
    box.onmouseout = function(e)  
    {  
         if(!this.parentNode) return; // FF feuert den Event zweimal, Bug?  
         if(!e) e= window.event;  
         var related = e.relatedTarget || e.toElement;  
         while (related && related != this)  
         {  
              related = related.parentNode;  
              if (related == this) return;  
         }  
         this.parentNode.removeChild( this);  
         box = null;  
    }  
}  
function mouse_pos(evt)  
{  
    if(!evt) evt = window.event;  
    var pos = new Object();  
    pos.left = evt.clientX;  
    pos.top = evt.clientY;  
    var b = (window.document.compatMode && window.document.compatMode == "CSS1Compat") ?  
   window.document.documentElement : window.document.body || null;  
    if (b)  
    {  
        pos.scrollLeft= pos.left + b.scrollLeft;  
        pos.scrollTop = pos.top + b.scrollTop;  
    }  
    return pos;  
}  
</script>  

  
<div style="border:1px solid black" onmouseover="show(event)">test</div>  

Struppi.