fucntion delay not working

Ricky

Hi,

I am trying to create this rollover bar menu with js and it works
fine until it has to disappear I wanted it to disappear after the
mouseout function and after a little delay but instead it disappears
right away. Here is the whole code, any suggestions will be helpful

<html>
<head>
<style type="text/css">
/*div.horbar { display:block; white-space:nowrap;
text-transform:capitalize; height: auto; margin: 0 0 0 0; }
ul.horbar_menu { display: block; background-color:#fff; color:#fff;
font-size:100%; margin: 0 0 0 0; padding:0 0 0 0;}
ul.horbar_menu li { display:inline; margin: 0 0 0 0; padding:0 0 0 0;
text-align:center; border-width: thin; border-style: hidden;}*/
/*ul.horbar_menu li a { text-decoration: blink; padding:0 0 0 0;}
ul.horbar_menu li.divlyn { margin:0 0 0 0; padding:0 0 0 0; border: 0
hidden; background-color:#000; color:#000;}*/
ul.horbar_submenu { display: none; font-weight: normal; margin: 0;
padding:0 ; text-align:center; }
ul.horbar_submenu li { display:inline; margin:0; padding:0;
text-align:center; border:0;}
ul.horbar_submenu li a { text-decoration:underline; padding:0 1px 0
1px; text-align:center;}
ul.horbar_submenu li.divlyn { margin:0; padding:0; border:0 solid;
background-color:#000; color:#000;}
/*#horbar_menu1, #horbar_menu1 li a { background-color:#fff;}
ul.horbar_menu li a:hover { background-color:#ee0 !important;
color:#300 !important;} - For changing the main menu */
#horbar_submenu0 { background-color:#fff; color:#000;}
#horbar_submenu1, #horbar_submenu1 li a { font: Verdana, Arial,
Helvetica, sans-serif; font-size:11px; background-color:#900;
color:#eff;}
#horbar_submenu2, #horbar_submenu2 li a { font: Verdana, Arial,
Helvetica, sans-serif; font-size:11px; background-color:#090;
color:#fef;}
#horbar_submenu3, #horbar_submenu3 li a { font: Verdana, Arial,
Helvetica, sans-serif; font-size:11px; background-color:#009;
color:#ffe;}
#horbar_submenu4, #horbar_submenu6 li a { font: Verdana, Arial,
Helvetica, sans-serif; font-size:11px; background-color:#620;
color:#000;}
#horbar_submenu5, #horbar_submenu4 li a { font: Verdana, Arial,
Helvetica, sans-serif; font-size:11px; background-color:#451;
color:#fff;}
#horbar_submenu6, #horbar_submenu7 li a { font: Verdana, Arial,
Helvetica, sans-serif; font-size:11px; background-color:#985;
color:#fff;}
#horbar_submenu7, #horbar_submenu5 li a { font: Verdana, Arial,
Helvetica, sans-serif; font-size:11px; background-color:#359;
color:#fff;}
ul.horbar_submenu li a:hover { background-color:#fff !important;
color:#21559c !important;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: none;}
a:active {text-decoration: none;}
</style>
<script type="text/javascript" xml:whitespace="preserve">
var intLastSubMenu = new Number(7);
var elmSubMenu = new Object();
function subMenuShow(intWhich) {
for (var i=0;i<=intLastSubMenu;i++) {
elmSubMenu = document.getElementById('horbar_submenu'+i);
if ((typeof elmSubMenu != "undefined")&&(elmSubMenu!=null)) {
elmSubMenu.style["display"] = ((i==intWhich)?"block":"none");
}
}
return false;
}
function subMenuHide(intWhich) {
for (var i=0;i<=intLastSubMenu;i++)
{
elmSubMenu = document.getElementById('horbar_submenu'+i);
if ((typeof elmSubMenu != "undefined")&&(elmSubMenu!=null)) {
elmSubMenu.style["display"] = ((i==intWhich)?"none":"none");
}
}
return false;
}
setTimeout("subMenuHide()", 1000);
</script>
</head>
<body>
<table width="628" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="628"><div class="horbar">

<a href="#" onMouseOver="subMenuShow(1)"><img
src="images/aboutUS.jpg" width="73" height="28" border="0"></a><a
href="#" onMouseOver="subMenuShow(2)"><img src="images/Calendar.jpg"
width="134" height="28" border="0"></a><a href="#"
onMouseOver="subMenuShow(3)"><img src="images/resources.jpg"
width="76" height="28" border="0"></a><a href="#"
onMouseOver="subMenuShow(4)"><img src="images/pedagogy.jpg" width="72"
height="28" border="0"></a><a href="#"
onMouseOver="subMenuShow(5)"><img src="images/publications.jpg"
width="92" height="28" border="0"></a><a href="#"
onMouseOver="subMenuShow(6)"><img src="images/discussion.jpg"
width="123" height="28" border="0"></a><a href="#"
onMouseOver="subMenuShow(7)"><img src="images/search.jpg" width="58"
height="28" border="0"></a>


<div onMouseOut="subMenuHide()">
<ul class="horbar_submenu" id="horbar_submenu1" >
<li><a href="#" type="text/html" title="?">Welcome Message</a> |
<a href="#" type="text/html" title="?">CETL Staff</a> |
<a href="#" type="text/html" title="?">CETL Board</a> |
<a href="#" type="text/html" title="?">Mission Goals</a> |
<a href="#" type="text/html" title="?">Faculty Associates</a> |
<a href="#" type="text/html" title="?">Annual Reports</a> |
<a href="#" type="text/html" title="?">Location Hours</a> |
<a href="#" type="text/html" title="?">Contact Us</a></li></ul>

<ul class="horbar_submenu" id="horbar_submenu2">
<li><a href="#" type="text/html" title="?">Welcome Message</a> |
<a href="#" type="text/html" title="?">CETL Staff</a> |
<a href="#" type="text/html" title="?">CETL Board</a> |
<a href="#" type="text/html" title="?">Mission Goals</a> |
<a href="#" type="text/html" title="?">Faculty Associates</a> |
<a href="#" type="text/html" title="?">Annual Reports </a> |
<a href="#" type="text/html" title="?">Location Hours </a>|
<a href="#" type="text/html" title="?">Contact Us</a></li></ul>

<ul class="horbar_submenu" id="horbar_submenu3">
<li><a href="#" type="text/html" title="?">Welcome Message</a> |
<a href="#" type="text/html" title="?">CETL Staff</a> |
<a href="#" type="text/html" title="?">CETL Board</a> |
<a href="#" type="text/html" title="?">Mission Goals</a> |
<a href="#" type="text/html" title="?">Faculty Associates</a> |
<a href="#" type="text/html" title="?">Annual Reports</a> |
<a href="#" type="text/html" title="?">Location Hours</a> |
<a href="#" type="text/html" title="?">Contact Us</a></li></ul>

<ul class="horbar_submenu" id="horbar_submenu4">
<li><a href="#" type="text/html" title="?">Welcome Message</a> |
<a href="#" type="text/html" title="?">CETL Staff</a> |
<a href="#" type="text/html" title="?">CETL Board</a> |
<a href="#" type="text/html" title="?">Mission Goals</a> |
<a href="#" type="text/html" title="?">Faculty Associates</a> |
<a href="#" type="text/html" title="?">Annual Reports</a> |
<a href="#" type="text/html" title="?">Location Hours</a> |
<a href="#" type="text/html" title="?">Contact Us</a></li></ul>

<ul class="horbar_submenu" id="horbar_submenu5">
<li><a href="#" type="text/html" title="?">Welcome Message</a> |
<a href="#" type="text/html" title="?">CETL Staff</a> |
<a href="#" type="text/html" title="?">CETL Board</a> |
<a href="#" type="text/html" title="?">Mission Goals</a> |
<a href="#" type="text/html" title="?">Faculty Associates</a> |
<a href="#" type="text/html" title="?">Annual Reports</a> |
<a href="#" type="text/html" title="?">Location Hours</a> |
<a href="#" type="text/html" title="?">Contact Us</a></li></ul>

<ul class="horbar_submenu" id="horbar_submenu6">
<li><a href="#" type="text/html" title="?">Welcome Message</a> |
<a href="#" type="text/html" title="?">CETL Staff</a> |
<a href="#" type="text/html" title="?">CETL Board</a> |
<a href="#" type="text/html" title="?">Mission Goals</a> |
<a href="#" type="text/html" title="?">Faculty Associates</a> |
<a href="#" type="text/html" title="?">Annual Reports</a> |
<a href="#" type="text/html" title="?">Location Hours</a> |
<a href="#" type="text/html" title="?">Contact Us</a></li></ul>

<ul class="horbar_submenu" id="horbar_submenu7">
<li><a href="#" type="text/html" title="?">Welcome Message</a> |
<a href="#" type="text/html" title="?">CETL Staff</a> |
<a href="#" type="text/html" title="?">CETL Board</a> |
<a href="#" type="text/html" title="?">Mission Goals</a> |
<a href="#" type="text/html" title="?">Faculty Associates</a> |
<a href="#" type="text/html" title="?">Annual Reports</a> |
<a href="#" type="text/html" title="?">Location Hours</a> |
<a href="#" type="text/html" title="?">Contact
Us</a></li></ul></div></div></td>
</tr>
</table>
</body></html>
Thx in advance.
Ricky

Jul 23 '05 #1

Subscribe Post Reply

1571

S Chalmers

"Ricky" <in**@djricky.com> wrote in message
news:9a**************************@posting.google.c om...

Hi,

I am trying to create this rollover bar menu with js and it works
fine until it has to disappear I wanted it to disappear after the
mouseout function and after a little delay but instead it disappears
right away. Thx in advance.
Ricky

Another problem you have is that doing this:
<div onMouseOut="subMenuHide()">
hides your menu on all mouseout events associated with the contained links.
It's OK to hide the menu after a delay, provided that any pending delay is
cancelled by all subsequent mouseovers within the div.

Add this code to your script:

var smTimer=null;

function smDelay(action)
{
clearTimeout(smTimer);
if(action==true)
smTimer=setTimeout("subMenuHide()",1000);
}
Then in *both* div tags, place these statements:

onmouseover='smDelay(false)'; onmouseout='smDelay(true)'

This should give the functionality you wanted, however your functions are
compatible only with relatively recent browsers.

--
Stephen Chalmers

Jul 23 '05 #2

Similar topics

(Tkinter) Adding delay to PopUpMsg

by: Harlin Seritt | last post by:

I am working on making something called a PopMsg widget which is actually identical to a Balloon widget from Pmw. Here is the code: ---code--- from Tkinter import * import time class PopMsg:...

Python

"delay" function

by: Shuo Xiang | last post by:

Greetings: I'm working on some graphical game and need to animate certain things (by continuously changing the x/y coordinate and update the display), however, the system is blinkingly fast so...

C / C++

WAITFOR DELAY

by: Des L. Davis | last post by:

System: Dell PowerEdge Server with 3 GB RAM, 2.4 GHz Celeron Software: Microsoft SQL Server 2000 Enterprise running on Windows 2003 Server Software: Microsoft SQL Server 2000 Enterprise running on...

Microsoft SQL Server

How to introduce delay in C#..

by: Maheshkumar.R | last post by:

Hi groups, How i can introduce some milliseconds delay in application. How i can do achieve this... let me clearly say... (1) I'm displaying slices of medical images. For framerate - for...

C# / C Sharp

20 sec delay opening tcp connection from within IE hosted control

by: mfeingold | last post by:

I am working on a system, which among other things includes a server and a ..net control sitting in an html page and connected to the server. I ran into a couple of problems, you guys might have...

ASP.NET

Using sleep to delay execution for long periods of time?

by: Max | last post by:

This is a follow-up on my previous thread concerning having the program wait for a certain date and time and then executing some code when it gets there. My question is; can I use the Sleep...

Visual Basic .NET

Crystal Reports: long delay to open

by: nj609eagle | last post by:

Recently and without warning, a report that I was using in my VB.NET 2003 application started to take 10 minutes to load. It also take thisamount of time to open in the deisgner. I'm using a...

Visual Basic .NET

Need Help in my module.. of Delay Audiotary Feedback

by: taaz | last post by:

I'm developing the Delay Audiometry feedback. My Step are... Recording -> Playing... these are on different events. I've used the mcisendstring()for manipulation of audio & made the functions ...

Visual Basic 4 / 5 / 6

Easy Steps to Fix "Canon Printer Won't Connect to WiFi Network"

by: taylorcarr | last post by:

A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...

General

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Basic Javascript concepts

by: aa123db | last post by:

Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...

Javascript

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

How to build RAID in BIOS?

by: Hystou | last post by:

There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

Computer Hardware

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...

General

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++