Hide a div when mouse is inactive for 5 seconds then show when mouse is active!

Better example of  jQuery mousemove() event to Show div for 5 seconds then Hide it after the delay!

This script is basically show a div when the mouse is active ie., when you move the mouse on the Document, If the mouse is not active then the div will disappear after 5 seconds.

Here is the entire code with demo and download!

width: 250px;
border-radius: 10px;
padding: 10px;
border: 2px double gray;
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

var timedelay = 1;
function delayCheck()
if(timedelay == 5)
timedelay = 1;
timedelay = timedelay+1;

$(document).mousemove(function() {
timedelay = 1;
_delay = setInterval(delayCheck, 500);
// page loads starts delay timer
_delay = setInterval(delayCheck, 500)

<div id="showdiv">
<h2>hide me when the mouse is inactive for 5 seconds.</h2>

You can see the demo or download the script from the below links 😉

Demo Download

One Comment

Add a Comment

Your email address will not be published. Required fields are marked *