<area> and <div>

[zekmek]

Hello everybody,

Here is my question:

I have an <area>:
<area shape=&quot;rect&quot; coords=&quot;417,278,596,400&quot; href=&quot;javascript:showHideForm('divForm', true);&quot;>

When i click on it, it makes appear a <div> called divForm:
<div id=&quot;divForm&quot; style=&quot;display:none; width:190; height: 80; position: absolute; top:450; left:490; z-index:2 visibility: visible; background-color: #FFCC33;&quot;>
<table class=&quot;texteNoirNormal&quot; align=&quot;center&quot; width=&quot;100%&quot; border=&quot;0&quot; bgcolor = &quot;#FFCC33&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot;>
<tr>
<td>
<font color=&quot;#000000&quot;>
<a href=&quot;<%=Link6%>&quot; onClick=&quot;<%=Link6%>&quot;> <font color=&quot;#000000&quot;>Hyères (Port Pothuau)</font>TEST</a>
</font>
</td>
</tr>
</table>
</div>

What i would like to do but don't know how is when i click outside the <div>, the <div> has to disappear. To make it disappear i can call the same function that makes it appear. But how i tell him, when you click outside ...

Here is what i have tried for now on:
<area shape=&quot;rect&quot; coords=&quot;417,278,596,400&quot; href=&quot;javascript:showForm('divForm', true);&quot; onBlur=&quot;javascript:hideForm('divForm', true);&quot;>. It works, when i click outside, the <div> disappears but the problem is that when i click on the link inside the <div> it disappears too, and the link doesn't work ...

I hope everything is clear.

Thank you for your answers.

 

[Einstein47]

you are on the right track. The answer lies in the use of the &quot;onBlur&quot; event handler. However you need to put it in the <DIV> tag. Like so:

<div id=&quot;divForm&quot; style=&quot;display:none; width:190; height: 80; position: absolute; top:450; left:490; z-index:2 visibility: visible; background-color: #FFCC33;&quot; onBlur=&quot;hideForm('divForm', true)&quot;>

This should run the &quot;hideForm&quot; function when the user clicks outside the <DIV>.


Einstein47
(&quot;Vision without action is a daydream - Action without vision is a nightmare. Japanese Proverb&quot

 

[zekmek]

Thanks, this works but not completely. When the user clicks outside the <div>, hideForm runs but even when the user clicks in the <div>, on the links, the <div> disappears and the href doesn't work.

 

[zekmek]

Don't search anymore, i have found out a solution during my sleep ;-)

I have just added pause time before the <div> disappears It gives some time to the href to take effect !

Thank you all !