timeout script fail

[thezwallrus]

hi all,

i'm working on a google maps application and have set up a custom form to handle what type of markers the person would like to view. when a person clicks on this form, with both a text box and a down-arrow to the right, it should show the box, which doesn't work for the image. but I digress, I'll ask about that later.

the more important concern is that I want this box to disappear when the user doesn't want it. so I used an onmouseout with a timeout set. (if you know of any better way, please let me know! especially clicking anywhere else on the screen) then, when the onmouseover event is triggered, I have it set to clear the timeout. but it doesn't! here's the code:



var inputTimeout

function toggleDown() {
document.getElementById("d_arrow").innerHTML = "<img src='images/d_arrow2.png' />";
clearTimeout(inputTimeout);
};

function toggleUp() {
document.getElementById("d_arrow").innerHTML = "<img src='images/d_arrow.png' />";
inputTimeout = setTimeout("inputClose();", 5000);
};

function inputClose() {
document.getElementById("input_dropdown").style.display = "none";
};

function dropDown() {
document.getElementById('input_dropdown').style.display = "block";
};

<div class="input_cont" onmouseover="this.className='input_cont_hi';toggleDown();" onmouseout="this.className='input_cont';toggleUp();" onclick="dropDown();">



please help! :]