looping help? - Javascript

Germking

i'm trying to make a menu that will sit on the right of the
screen...and when you scroll over it...the submenu should slide out to
the right...

i've named the layers for each of the
submenus...menu1...menu2...menu3...

what i want to do...
....is reference the function 'show()' when moving over each menu
item...to say that this is menu item number 1...show submenu number
1...
....my code is below...
....if someone has any bright ideas...
....please feel free to share them with me...
....thanks.

<html><head>
<script language="javascript">
var i=0
var intHide
var intShow
var speed=3
var a=0
function showmenu()
{
clearInterval(intHide)
intShow=setInterval("show()",10)
}
function hidemenu()
{
clearInterval(intShow)
intHide=setInterval("hide()",10)
}
function show(a)
{
if (i<117)
{
i=i+speed
document.getElementById('menu'+a).style.left=i
}
}
function hide(a)
{
if (i>0)
{
i=i-speed
document.getElementById('menu'+a).style.left=i
}
}
</script></head>
<body leftmargin="0" topmargin="0" bgcolor=#ffffff>
<div id="all"
style="position:relative;left:5;top:5;width:800:he ight:600;">

<div id="menu1" class="menu1"
style="position:absolute;left:0;top:120;width:100; ">
<table width="100" cellspacing="1" cellpadding="0" bgcolor=#000000
onmouseover="showmenu()" onmouseout="hidemenu()">
<tr><td bgcolor=#000066 align="center" height="15"><a href=#><font
color=#cccccc>SubMenu1</font></a></td></tr>
<tr><td bgcolor=#000066 align="center" height="15"><a href=#><font
color=#cccccc>SubMenu2</font></a></td></tr>
<tr><td bgcolor=#000066 align="center" height="15"><a href=#><font
color=#cccccc>SubMenu3</font></a></td></tr>
<tr><td bgcolor=#000066 align="center" height="15"><a href=#><font
color=#cccccc>SubMenu4</font></a></td></tr>
</table>
</div>

<div id="menu2" class="menu2"
style="position:absolute;left:0;top:135;width:100; ">
<table width="100" cellspacing="1" cellpadding="0" bgcolor=#000000
onmouseover="showmenu()" onmouseout="hidemenu()">
<tr><td bgcolor=#000066 align="center" height="15"><a href=#><font
color=#cccccc>SubMenu1</font></a></td></tr>
<tr><td bgcolor=#000066 align="center" height="15"><a href=#><font
color=#cccccc>SubMenu2</font></a></td></tr>
<tr><td bgcolor=#000066 align="center" height="15"><a href=#><font
color=#cccccc>SubMenu3</font></a></td></tr>
</table>
</div>

<div id="menu3" class="menu3"
style="position:absolute;left:0;top:150;width:100; ">
<table width="100" cellspacing="1" cellpadding="0" bgcolor=#000000
onmouseover="showmenu()" onmouseout="hidemenu()">
<tr><td bgcolor=#000066 align="center" height="15"><a href=#><font
color=#cccccc>SubMenu1</font></a></td></tr>
<tr><td bgcolor=#000066 align="center" height="15"><a href=#><font
color=#cccccc>SubMenu2</font></a></td></tr>
<tr><td bgcolor=#000066 align="center" height="15"><a href=#><font
color=#cccccc>SubMenu3</font></a></td></tr>
</table>
</div>

<div id="nav" class="nav"
style="position:absolute;left:0;top:120;width:120; ">
<table width="120" cellspacing="1" cellpadding="0" bgcolor=#000000>
<tr><td bgcolor=#ffffff align="center" height="15"
onmouseover="show(1);showmenu()" onmouseout="hidemenu()"><a
href=#>Menu1</a></font></td></tr>
<tr><td bgcolor=#ffffff align="center" height="15"
onmouseover="show(2);showmenu()" onmouseout="hidemenu()"><a
href=#>Menu2</a></td></tr>
<tr><td bgcolor=#ffffff align="center" height="15"
onmouseover="show(3);showmenu()" onmouseout="hidemenu()"><a
href=#>Menu3</a></td></tr>
</table>
<table width="120" cellspacing="0" cellpadding="0">
<tr><td bgcolor=#ffffff align="center" height="70"> </td></tr>
</table></div></div></body></html>

Jul 26 '05 #1

Subscribe Post Reply

1141

Danny

So........ what do you need help with?

--
Using Opera's revolutionary e-mail client: http://www.opera.com/mail/

Jul 28 '05 #2

Lasse Reichstein Nielsen

Danny <da*******@bluebottle.com> writes:

So........ what do you need help with?

*please* quote some of the message you reply to. Not all of it, ofcourse,
but enough to give your reply a context. In this case, at least the
attribution would have made it obvious *who* you were asking this.

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Jul 28 '05 #3

Germking

if you paste the script into notepad...and save it as an html
file...you will see that it doesn't work...

i need help with making it work...

function show(a)
{
if (i<117)
{
i=i+speed
document.getElementById('menu'*+a).style.left=i
}

}

if you look at the 'a' in show(a)...
....i got it wrong somewhere along the line...
....i want to reference menu1, menu2 and menu3 in the function...
....so that all i have to do...is make a reference to 1...and 1's
submenu should show...
....but i don't know how to do this...
....do i need to make a loop of some sort?

Jul 28 '05 #4

RobG

Germking wrote:

i'm trying to make a menu that will sit on the right of the
screen...and when you scroll over it...the submenu should slide out to
the right...

i've named the layers for each of the
submenus...menu1...menu2...menu3...

what i want to do...
...is reference the function 'show()' when moving over each menu
item...to say that this is menu item number 1...show submenu number
1...
...my code is below...
...if someone has any bright ideas...
...please feel free to share them with me...
...thanks.
I take it you want to know why it doesn't work? It just sits there
generating errors whenever the cursor is over a menu item.

<html><head>
<script language="javascript">
The language attribute is depreciated, type is required.

<script type="text/javascript">

var i=0
var intHide
var intShow
var speed=3
var a=0
function showmenu()
{
clearInterval(intHide)
intShow=setInterval("show()",10)
}
function hidemenu()
{
clearInterval(intShow)
intHide=setInterval("hide()",10)
}
function show(a)
Here your function declares a local variable 'a' which is distinct
from the global 'a' you created above. You don't pass the function a
value to use for 'a' and don't give it one internally, so it is undefined.

The initial value for your global 'a' is 0, you look for 'menu' + a,
but there is no element with id = menu0, so even if the value of
global a gets through, it's of no use.

Nothing much happens after that because your function has no element
reference to do anything with.

Over to you...

{
if (i<117)
{
i=i+speed
document.getElementById('menu'+a).style.left=i
}

[...]
--
Rob

Jul 28 '05 #5

Germking

ok...
....i understand that i'm not referencing 'a' internally correctly...
....but i don't understand how to reference it properly...
....is it possible...that when the mouse goes over the menu...
....to say...onmouseover="show(1)"...
....or does this have to be in the form..."show(true,false,false)"...

....do i have to reference each item individually?
....or can i make a loop that makes it easier and quicker to reference
each menu item?
....if so...how do i make this loop?

my main concern with all of this is that...
....when i've got 15/20 menu items...each with 4/5 submenu items...and
so on...
....the filesize of the file is going to sky rocket...not to
mention...confusion will reign...
....and the menu will be a little slow for my liking...

Jul 28 '05 #6

RobG

Germking wrote:

ok...
...i understand that i'm not referencing 'a' internally correctly...
...but i don't understand how to reference it properly...
...is it possible...that when the mouse goes over the menu...
...to say...onmouseover="show(1)"...
You can pass a reference to the element to the function from the event:

function showHide ( el ) {
...
}

<div ...onmouseover="showHide(this);" ...>
or if a function reference is added to an element's intrinsic event
handler by script (greatly reducing page source code) 'this' inside the
function will reference the element that called it.
<div id="ex" style="width: 150px; height: 150px;
border: 1px solid blue;"></div>

<script type="text/javascript">

function showId(){
alert( (this.id)? this.id : 'no id' );
}

document.getElementById('ex').onmouseover = showId;

</script>

...or does this have to be in the form..."show(true,false,false)"...

...do i have to reference each item individually?
...or can i make a loop that makes it easier and quicker to reference
each menu item?
...if so...how do i make this loop?

my main concern with all of this is that...
...when i've got 15/20 menu items...each with 4/5 submenu items...and
so on...
...the filesize of the file is going to sky rocket...not to
mention...confusion will reign...
...and the menu will be a little slow for my liking...

Start with a menu framework that works:

<URL:http://www.mattkruse.com/javascript/mktree/>

<URL:http://www.quirksmode.org/js/display.html>
and modify it to suit (primarily through CSS).
--
Rob

Jul 29 '05 #7

Similar topics

Looping through session data

by: ensnare | last post by:

Hi all, I'm using a database session handler and am looking to loop through data residing in the sessions table to make a 'Users online' array. I've found that using urldecode on the data...

PHP

Using Recursion looping through a ADO RS

by: Dacuna | last post by:

Is it possible to use a recursive function to loop through a recordset faster? I have a table that I need to edit its contents after doing some calculation. The table has one field has an RawData...

Visual Basic .NET

Looping through a filtered GridView

by: Ken | last post by:

Hi All - I have a filtered GridView. This GridView has a check box in the first column. This check box is used to identify specific rows for delete operations. On the button click event I...

ASP.NET

Not looping

by: Jeff | last post by:

Hey gang. I have a script that gets stats from a mssql db, and then inserts those stats into a temp table. where i can work with them as i wish. the problem is it isn't looping through all the...

ASP / Active Server Pages

Looping code for an unknown reason!

by: Luke - eat.lemons | last post by:

Hi, Im pretty new to asp so all light on this question would be great. Basically i need to test to see what value is set (where to retrieve the data from) so ive done it like this: If...

ASP / Active Server Pages

Looping code that i cant seem to work out!

by: Luke - eat.lemons | last post by:

Sorry for the post in this NG but im short on time to get this working and i haven't seem to of got a response anywhere else. Im pretty new to asp so all light on this question would be great. ...

ASP.NET

Looping and relational (if else) question

by: jwatson | last post by:

hey guys need help or some guidances please. Basically its a complicated looping and relational question. Write a program to calculate te percentage score of the mark of the students.The program...

C / C++

Looping character or number visual basic 6

by: Ifoel | last post by:

Hi all, Sorry im beginer in vb. I want making programm looping character or number. Just say i have numbers from 100 to 10000. just sample: Private Sub Timer1_Timer() if check1.value= 1...

Visual Basic 4 / 5 / 6

How to looping with Timer?

by: Davaa | last post by:

Dear all, I am a student making a MS Form application in C++. I would ask a question about "Timer". Sample code which I am developing is below. private: System::Void...

C / C++

Problem with checkbox looping

by: chiku1523 | last post by:

Hi, Please find the following code. In function setAnswers, I am looping with each question. I have inner loop, which is looping for each answers of the questions. If any of the answer for question...

Javascript

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

Migrating Website to Cloud - Emmanuel Katto

by: emmanuelkatto | last post by:

Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel

General

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

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++

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

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...

Windows Server

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

General

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

Career Advice