[Javascript] hide div in mouseout

Michael Borchers list at tridemail.de
Thu Dec 20 08:08:59 CST 2007


I guess it's a common problem!

I have a <div> element which is created by a link. When leaving the <div> (onmouseout) it will disappear.
The problem is that even when leaving the link, that created the <div>, the <div> disappears before even
"touching" it.

That's why I use this function that I found:

<div onmouseout="javascript:if(checkMouseLeave(this, event)) { hide(); }">

function checkMouseLeave (element, evt) {alert(evt);
  if (element.contains && evt.toElement) {
    return !element.contains(evt.toElement);
  }
  else if (evt.relatedTarget) {
    return !containsDOM(element, evt.relatedTarget);
  }
}


So far so good! But in my latest project I create the <div> dynamically by
var div = createElement('div');

Now I have to assign the event handler onmouseout. With a simple function I would chose:
div.onmouseout = function() { hide(this) };

There we have the old problem. If I would replace it with the function above:
div.onmouseout = function() { checkMouseLeave(this, event) };
the function won't find the 'event', since the var did not exist when I assigned the function dynamically to the div.

So I'm searching for 2 options I guess:
1. Simpy add the function() { hide() } which can(!) call the checkMouseLeave functionality and then hide the div
2. Find a way to put the whole line into the event onmouseout, something like div.onmouseout = "javascript:if(checkMouseLeave(this, event)) { hide(); }"
    I know this one WORKS: div.setAttribute('onmouseout', 'javascript:if(checkMouseLeave(this, event)) { hide(); }');
    But as far as I know this is not "allowed" or can cause problems with other browsers.

Any ideas?


-- 
MfG
Michael Borchers
Tridem GmbH
http://www.tridem.de
mailto: borchers at tridem.de
Tel.: 0491 / 96 06 71 63
ICQ: 322766923
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.evolt.org/pipermail/javascript/attachments/20071220/349429bd/attachment.htm>


More information about the Javascript mailing list