Run a function after 2 sec

**webx2000** · Oct 10th, 2003, 04:21 PM

Hi there, I'm designing a web page in which I want to change a cell color if the mouse has been within the cell for 2 seconds. Can somebody help me in this one, thanks

**axion_sa** · Oct 12th, 2003, 04:20 AM

I didn't add browser compatability, so it's pretty much IE specific:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > 
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 7.0">
<TITLE></TITLE>
	<script language="javascript" type="text/javascript">
		var timeoutId = 0;
		var currentCell = "";
		
		var hoverColor = "silver";
		var normalColor = "";
		var timeoutLength = 2000;
		
		function setCellColor(cellId, color) {
			var obj = document.all[cellId];
			if (obj != null) {
				obj.style.backgroundColor = color;
			}
			removeTimeout();
		}
		
		function cellMouseOver(cellId) {
			if (currentCell != "") {
				setCellColor(currentCell, normalColor);
			}
			removeTimeout();
			
			currentCell = cellId;
			timeoutId = setTimeout("setCellColor('" + cellId + "', '" + hoverColor + "');", timeoutLength);
		}
		
		function cellMouseExit(cellId) {
			removeTimeout();
			setCellColor(cellId, normalColor);
		}
		
		function removeTimeout() {
			if (timeoutId != 0) {
				clearTimeout(timeoutId);
				timeoutId = 0;
			}
		}
	</script>
</HEAD>
<BODY>

<table border="0" cellpadding="2" cellspacing="0">
	<tr>
		<td id="tdCell1" onmouseenter="cellMouseOver('tdCell1');" onmouseleave="cellMouseExit('tdCell1');">Cell 1</td>
		<td id="tdCell2" onmouseenter="cellMouseOver('tdCell2');" onmouseleave="cellMouseExit('tdCell2');">Cell 2</td>
	</tr>
</table>

</BODY>
</HTML>

**CornedBee** · Oct 12th, 2003, 08:28 AM

Replace onmouseenter with onmouseover, onmouseleave with onmouseout and document.all[id] with document.getElementById(id) and it should work on all important browsers: IE5+, Mozilla, NS6+, Opera 6+, Konqueror and Safari.

Even easier, pass this instead of the cell ids in the event handler and forget about the document.all/document.gEBI completly.

**webx2000** · Oct 12th, 2003, 11:13 PM

Thank u all for ur help

Thread: Run a function after 2 sec

Thread Tools

Display

Run a function after 2 sec

Posting Permissions