Simple onMouseOver script
I have created the onMouseOver but I don't know how to declare variables on the fly using javascript.
Here is the script I have so far.
<script language="javascript">
<!--
var bDoesDHTML = ( (navigator.userAgent.indexOf("MSIE") >= 0)&&
(navigator.appVersion.substring(0,1) >= 4) )
if(bDoesDHTML){document.write("<STYLE>.off{display:none}</STYLE>")}
function doSection(secNum){
if (bDoesDHTML){
if (secNum.className=="off"){secNum.className="on";
document.Sec1Gif.src='Open.gif'}
else{secNum.className="off";
document.Sec1Gif.src='Closed.gif'}
}
}
//-->
</script>secNum varies from 1 to 7. I could write this 7 times but that doesn't seem like the right thing to do. Using ASP I would create a variable and write it as "Sec" & secNum & "Gif" which would create the image name for each one. How would I do this in javascript? I'm assuming under the function is where it would go.
Thanks for your help.
I could create an ASP array but that also doesn't seem right. Is it?
Adrian J. Moreno posted this at 15:53 — 26th July 2001.
They have: 19 posts
Joined: Jul 2001
I think this is along the lines of what you're asking.
You can refer to images in the DOM array as document.images[x].yadda
You can also refer to the image name
as document.images["blarg"].yadda
So since you're passing secNum as an integer, you can reference document.images["Sec" + secNum + "Gif"].yadda dynamically. This is faster than using the eval() function to compile the string you would use in place of "images[x]".
As long as you want all seven images to turn into "Closed.gif" as you reference it, you're golden. However, you do have to define seperately each individual image element if you want Sec1Gif, Sec2Gif, etc. to each use a different image.
artsapimp posted this at 16:12 — 26th July 2001.
They have: 330 posts
Joined: Apr 2000
Thank you.
I am very close to making it work, but I don't know how to find out what the variable secNum is. I tried to document.write(secNum) but that wrote [object] which doesn't seem to be right. I thought it was a number (1-7) but it's not.
How would I write the secNum?
Thanks again for any help.
Free Math Test
Fun Math Games
Adrian J. Moreno posted this at 16:24 — 26th July 2001.
They have: 19 posts
Joined: Jul 2001
How are you calling the function doSection? You should be calling it as onMouseOver="doSection(x)" where x is an integer.
Can you post a line of code that is your image tag and the that causes the mouseover?
artsapimp posted this at 16:36 — 26th July 2001.
They have: 330 posts
Joined: Apr 2000
Thank you for your help.
...<tr>
<td width="150" valign="top"><SPAN onClick="doSection(Sec1)"><img src="Closed.gif" name="Sec1Gif"> <b>Links</b></SPAN><br>
<DIV CLASS="off" ID="Sec1">
<table width="100%" cellpadding="2" cellspacing="4" border="0">
<tr>
<td bgcolor="#CCCCCC"><a href="generic.htm" class="menu">Home</a><br>
<a href="" class="menu">Reports</a><br>
<a href="" class="menu">Merger Update</a><br>
<a href="" class="menu">About Us</a><br>
<a href="" class="menu">Contact Us</a></td>
</tr>
</table>
</DIV></td>
</tr>
...
Free Math Test
Fun Math Games
Adrian J. Moreno posted this at 17:24 — 26th July 2001.
They have: 19 posts
Joined: Jul 2001
Then reference it as document.images[secNum + "Gif"].yadda
Should then translate to document.images["Sec1Gif"].yadda
Since you're apssing a string value, rather than an integer value:
a) you need single quotes around the string to justify it as one
b) you don't need to add double quotes around the string you're passing in the images[x] section.
artsapimp posted this at 18:38 — 26th July 2001.
They have: 330 posts
Joined: Apr 2000
Thank you for the help, but I have a new problem when I do that. The problem is because it's not being passed as a string which is what makes the function run correctly. It's looking for secNum which is a variable that obviously changes for each section. 'Sec1' is not a valid variable that is recognized within this function.
Again I am an ASP developer so I really don't know too much about javascript. I'm sorry if this is a lot of questions.
Below is the code I have written now and you can see where the variables are being sent. Where should I go from here?
<script language="javascript">
<!--
var bDoesDHTML = ( (navigator.userAgent.indexOf("MSIE") >= 0)&&
(navigator.appVersion.substring(0,1) >= 4) )
if(bDoesDHTML){document.write("<STYLE>.off{display:none}</STYLE>")}
function doSection(secNum){
if (bDoesDHTML){
if (secNum.className=="off"){secNum.className="on";
document.images[secNum + "Gif"].src='Open.gif'}
else{secNum.className="off";
document.images[secNum + "Gif"].src='Closed.gif'}
}
}
//-->
</script>
</head>
<body>
<table width="150" cellpadding="0" cellspacing="0" class="MainTable">
<tr>
<td width="150" valign="top"><SPAN onClick="doSection('Sec1')"><img src="Closed.gif" name="Sec1Gif"> <b>Links</b></SPAN><br>
<DIV CLASS="off" ID="Sec1">
<table width="100%" cellpadding="2" cellspacing="4" class="InsideTable">
<tr>
<td><a href="" class="menu">SCTSC Home</a><br>
<a href="" class="menu">Reports</a><br>
<a href="" class="menu">Merger Update</a><br>
<a href="" class="menu">About Us</a><br>
<a href="" class="menu">Contact Us</a></td>
</tr>
</table>
</DIV></td>
</tr>
Free Math Test
Fun Math Games
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.