delay onmouseOver help!

[toys19]

Hi
I am using onmouseOver to show layers, the onmouseOver is linked to an image, and I have found that whilst using the page it is easy and annoying to accidently activate this. So can I set a delay so that you can avoid the action occuring accidently?
I'm a bit of a newbie, my css and html is ok, but all my javascript has been automatically scripted onto my page by dreamweaver, please be gentle with me... :D

[jscheuer1]

The setTimeout() method is what you would want to use, but it's tricky. It would be far easier to advise you if we had a link to your page.

But let's just say you had something simple like so:

<img onmouseover="show('tip1');" src="some.gif">

It could be delayed by doing:

<img onmouseover="timer1=setTimeout(function(){show('tip1');}, 500);"
onmouseout="clearTimeout(timer1);" src="some.gif">

That would delay it by half a second, and cancel it if the mouse moved out before the time arrived. The 500 refers to milliseconds. But, as I say, it can get complicated, like if you need to pass variables, events, or event properties to the timeout function. Usually that type of code needs to go in one or more functions in the head of the page.

[toys19]

Hi Thanks for your reply. I appreciate you taking the time to help me.
Please see :www.silverarm.co.uk/index1.html to show what I am trying to achieve. Hover over the pictures.
I have tried to use the set time out function below, but it doesnt seem to work, all it does is disable the on mouseover event, I would really like to include the clearTimout command as well.. Do I need to do something to the Javascript in my header?
<div id="panelpic1"><a href="/DesignDevelopment/Mechanical/mechanical.html" onMouseOver="timer1=setTimeout(MM_showHideLayers('panelpiclarge1','','show');MM_showHideLayers('insert1','','show');MM_showHideLayers('insert4','','show');,500);" onMouseOut="MM_showHideLayers('panelpiclarge1','','hide');MM_showHideLayers('insert4','','hide');MM_showHideLayers('insert1','','hide')"><img src="/assets/sfcbodysmall.jpg" width="170" height="151" border="0"></a></div>

[jscheuer1]

Give this a shot:

<div id="panelpic1"><a href="/DesignDevelopment/Mechanical/mechanical.html"
onmouseover="timer1=setTimeout(function(){MM_showHideLayers('panelpiclarge1','','show');MM_showHideLayers('insert1','','show');MM_showHideLayers('insert4','','show');}, 500);"
onmouseout="clearTimeout(timer1);MM_showHideLayers('panelpiclarge1','','hide');MM_showHideLayers('insert4','','hide');MM_showHideLayers('insert1','','hide');">
<img src="/assets/sfcbodysmall.jpg" width="170" height="151" border="0"></a></div>

[toys19]

Jscheuer1 ! You are my new best friend!
Works perfectly.
Many thanks for your time and patience.:D

[Rob (SA)]

Hi Folks,

I have seen at this site

http://www.silverarm.co.uk/FailureAnalysis/failureanalysis.html

A similar idea that I would like to incorporate on my site. In that if you mouse over the pic it opens up lower down, larger and with some text.

I would like to generate an annual calendar with the same effect.

Instead of a visual picture I would see text (i.e JAnuary) and by mouse over it opens the month with all my events on it.

By clicking on January the frame will stay open.

I wonder if anyone can help /advise.

Kind Regards
Rob

[jscheuer1]

The site you mention has both images and text displayed onmouseover. Just get rid of the images.