How to detect whether or not the cursor is inside a div?

[tox0tes]

I want to detect the presence of the cursor inside a div, just giving a simple true or false return. However, I also need to detect the simultaneous onblur of a text box.

So, I want to do this in theory:

if(textbox.onblur && div.onmouseover)
{
function();
}

[mitya]

The easy way:

<div onMouseOver="javascript:mouseIsInside();" onMouseOut="javascript:mouseHasLeft();"></div>

The harder way:

set up an event to look for this, meaning you can keep your code semantic (i.e. free of styling and 'on' script events).

[tox0tes]

That solves the problem of detecting whether or not the cursor is in the div, but I also, simultaneously, need to detect whether or not another unrelated textbox has focus.

[Mr J]

How about something like this?

<script type="text/javascript">

a=false

function test(b){

if(b&&!a){
document.getElementById("div1").style.backgroundColor="#00AA00"
}

if(b&&a){
document.getElementById("div1").style.backgroundColor="#AA0000"
}

}

</script>

<style>

#div1{
width:200px;
height:150px;
background-color:#00AA00;
}

</style>

<div id="div1" onmouseover="test(true)" onmouseout="test(false)"></div>

<BR><BR>

<input type="text" id="t1" onfocus="new function(){a=true}" onblur="new function(){a=false}">