Close div after X seconds no activity?

**JBottero** · 12-01-2009, 07:24 AM

I have a <div> that I show / hide with the standard JS snip for doing that.

What I need is to figure out how to make it close after no mouse acitivity over the <div>.

Possible?

**vwphillips** · 12-01-2009, 10:34 AM

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
<style type="text/css">
/*<![CDATA[*/
.tog {
  width:100px;height:100px;background-Color:red;
}

/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
function Toggle(id,ms){
 obj=document.getElementById(id);
 obj.style.display=obj.style.display!='none'?'none':'block';
 Close(id,ms);
}

function Close(id,ms){
 obj=document.getElementById(id);
 clearTimeout(obj.to);
 obj.to=setTimeout(function(obj){return function(){obj.style.display='none';}}(obj),ms||4000);
}

/*]]>*/
</script>
</head>

<body>
<a href="javascript:Toggle('tst');" >Toggle</a>
<div id="tst" class="tog" onmousemove="Close('tst',2000);" ></div>
<br />
<a href="javascript:Toggle('tst1');" >Toggle</a>
<div id="tst1" class="tog" onmousemove="Close('tst1',12000);"></div>
</body>

</html>

**JBottero** · 12-03-2009, 12:03 PM

Fantastic, perfict. I've disected it to understand how it works, and been able to integrate it into my script. Thanks!

What is the reason / purpose of using the /*<![CDATA[*/ ... /*]]>*/ "wrapper"?

Thread: Close div after X seconds no activity?

Thread Tools

Search Thread

Close div after X seconds no activity?

The Following User Says Thank You to vwphillips For This Useful Post:

Bookmarks

Bookmarks

Posting Permissions