PDA

View Full Version : Layer Delay



fireplug41
08-31-2005, 03:54 AM
Does anyone know of an easy way to set a delay for a layer to hide when you mouseoff of it?

jscheuer1
08-31-2005, 04:18 AM
<div onmouseout="el=this;setTimeout('el.style.visibility=\'hidden\'',1000)" >Hello</div>

fireplug41
09-01-2005, 03:32 PM
what if I have multiple layers that it is effecting?

jscheuer1
09-01-2005, 04:59 PM
You asked for a simple way. That's it. It can be used for as many different elements as you like (layer is no longer of any real meaning in modern html). If you need more help or want a more complex method tailored to a specific markup or type of markup give more details, preferably a link to your page:

.

fireplug41
09-01-2005, 08:51 PM
I am looking for a way to delay the hiding of some navigational pieces. a sample url is http://www.firstingraphix.com/sri/repairservice.asp. If you roll over the repair services on the left side it opens a layer that has the additional buttons in it. if you roll over some of the buttons some of them have dropdown but not all of them. I want to have a little delay if you come off of that bar before it disappears becuase right now it disappears immediately, making it difficult to navigate. thanks

fireplug41
09-02-2005, 03:42 AM
This is the code for one of the layers on the page. If you rollover the repairservices menu 2 layers show. If you roll off the main layer (repairservicesover) onto the second layer (repairhide) then all of the layers hide. I am not sure if this is totally confusing or not but giving it a try to explain what I need to do.

<div id="repairhide" style="position:absolute; left:0; top:64px; width:800px; height: 279px; z-index: 10; visibility: hidden;" onMouseOver="MM_showHideLayers('repairhide','','hide','repairservicesover','','hide','endoscopylist','','hide','ultrasoundlist','','hide','instrumentlist','','hide')"><img src="mm_assets/style1/h/closer.gif" width="803" height="281"></div>

<div id="repairservicesover" style="position:absolute; left:0px; top:150px; width:800; height:25; z-index:400; visibility: hidden;" onMouseOver="MM_showHideLayers('repairhide','','show','repairservicesover','','show')"><img src="images/revised%20navbar/over/repair_services.gif" width="200" height="25" border="0" onMouseOver="MM_showHideLayers('endoscopylist','','hide','ultrasoundlist','','hide','instrumentlist','','hide')"><img src="mm_assets/style1/h/mmenu1.gif" alt="Endoscopy" name="endoscopy" width="120" height="25" border="0" id="endoscopy" onMouseOver="MM_swapImage('endoscopy','','images/revised%20navbar/selected/endoscopy.gif',0);MM_showHideLayers('endoscopylist','','show','ultrasoundlist','','hide','instrumentlist','','hide')" onMouseOut="MM_swapImgRestore()"><a href="rs_power.asp"><img src="images/revised%20navbar/over/power.gif" name="Image2" width="120" height="25" border="0" id="Image2" onMouseOver="MM_swapImage('Image2','','images/revised%20navbar/selected/power.gif',0);MM_showHideLayers('endoscopylist','','hide','ultrasoundlist','','hide','instrumentlist','','hide')" onMouseOut="MM_swapImgRestore()"></a><a href="rs_phaco.asp"><img src="images/revised%20navbar/over/phaco.gif" name="Image3" width="120" height="25" border="0" id="Image3" onMouseOver="MM_swapImage('Image3','','images/revised%20navbar/selected/phaco.gif',0);MM_showHideLayers('endoscopylist','','hide','ultrasoundlist','','hide','instrumentlist','','hide')" onMouseOut="MM_swapImgRestore()"></a><img src="images/revised%20navbar/over/ultrasound.gif" name="Image1" width="105" height="25" id="Image1" onMouseOver="MM_showHideLayers('endoscopylist','','hide','ultrasoundlist','','show','instrumentlist','','hide');MM_swapImage('Image1','','images/revised%20navbar/selected/ultrasound.gif',0)" onMouseOut="MM_swapImgRestore()"><img src="images/revised%20navbar/over/instrument.gif" name="Image4" width="135" height="25" id="Image4" onMouseOver="MM_swapImage('Image4','','images/revised%20navbar/selected/instrument.gif',0);MM_showHideLayers('endoscopylist','','hide','ultrasoundlist','','hide','instrumentlist','','show')" onMouseOut="MM_swapImgRestore()"></div>