Jump to content

Div Onmouseout


blob84

Recommended Posts

Hi,I want to use onmouseout event on a div to close the div, the div have 2 images,is it possible?

<html><body><script type="text/javascript">a = document.createElement("div");a.style.height="300px";a.style.width="300px";a.style.border="2px solid black";a.setAttribute("id", "map");a.setAttribute("onmouseout", "document.body.removeChild(a);"); document.body.appendChild(a);b = document.createElement("img");b.setAttribute("src", "http://img254.imageshack.us/img254/4802/immagineesempiolf5.jpg");b.setAttribute("width", "200");b.setAttribute("height", "200");document.getElementById("map").appendChild(b);c = document.createElement("img");c.setAttribute("src", "http://www.calshop.biz/diario/wp-content/uploads/2006/03/Unaltra%20immagine%20della%20procace%20testimonial.%20Suo%20nonno%20si%20chiama%20George%20Bush,%20ma%20nessuna%20parentela%20la%20lega%20con%20il%20presidente.jpg");c.setAttribute("width", "30");c.setAttribute("height", "50");c.style.position="absolute";c.style.left="20%"; document.getElementById("map").appendChild(c);</script><input type="button" value="button" onclick="document.body.removeChild(a);" /></body></html>

Link to comment
Share on other sites

The problem is here:

a.setAttribute("onmouseout", "document.body.removeChild(a);");

Most browsers don't register event handlers for attributes that are added to an element after the page has loaded.You're not registering an event handler, all you're doing is setting an attribute.In order to properly put an event listener on an element, you need to use addEventListener() or attachEvent() [Microsoft]. The other alternative is to put the event type as a property of the object:

function doSomething(e) {  // Get the event object for all browsers  e = e?e:window.event;  // Get the element that fired the event for all browsers  var t = e.target?e.target:e.srcElement;  // Safari sometimes considers a text node as the one that fires the event:  if(t.nodeType == 3) t = t.parentNode;  // Remove the current element  t.parentNode.removeChild(t);}if(window.addEventListener) {  // Normal browsers  a.addEventListener("mouseout",doSomething,false);} else {  // Internet Explorer  a.attachEvent("onmouseout",doSomething);}

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...