What Am I Doing Wrong? (javascript problem)

[Rockrz]

I copied this script from a web site for a mouse over effect, and I'm trying to adapt it to my web page, and so far it ain't happening.

I've tried to duplicate the exact script, except for my images and I still cannot get it to work right.....

Any help would be appreciated!

Here's the script......(head)

<SCRIPT LANGUAGE="JavaScript">

<!--

if (document.images)
{ var image1 = new Image()
image1.src = "Graphics/b-homepage-1.gif"
var image1on = new Image()
image1on.src = "Graphics/b-homepage-2.gif"

var image2 = new Image()
image2.src = "Graphics/b-contactus-1.gif"
var image2on = new Image()
image2on.src = "Graphics/b-contactus-2.gif"

}
function off(imgName)
{ if (document.images)
document[imgName].src = eval(imgName + '.src')
}

function on(imgName)
{ if (document.images)
document[imgName].src = eval(imgName + 'on.src')
}

// -->

</SCRIPT>


Here's the script......(body)

<A onmouseover="on('image2');" onmouseout="off('image2')" href="homepage.html">
<IMG height=25 alt="Homepage"src="Graphics/b-homepage-1.gif" width=96 border=0 name=image2 ></A><BR>

<A onmouseover="on('image2');" onmouseout="off('image2')" href="contactus.html">
<IMG height=25 alt="Contact Us" src="Graphics/b-contactus-1.gif " width=96 border=0 name=image2 ></A>

[Saz]

It would help a little if you could give a url showing the rollovers 'not working'. I'm still a newby to javascript, so I can't tell what's wrong just by looking at the script on it's own!!!

[creole]

rockrz...

Try this script. It is a bit more compact and straightforward...plus it only uses one function instead of two.



<script language="javascript">
<!--

if (document.images) {

home_on = new Image();
home_on.src = "images/home_on.gif";
home_off = new Image();
home_off.src = "images/home_off.gif";

}

function changeImages() {
if (document.images) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = eval(changeImages.arguments[i+1] + ".src");
}
}
}

// -->
</script>


This is the image tag:

<a href="index.php3" onmouseover="changeImages('home', 'home_on')" onmouseout="changeImages('home', 'home_off')"><img src="images/home_off.gif" width="44" height="25" border="0" alt="" name="home"></a>


This is the script that I use for all of my pages and it works flawlessly.

[Rockrz]

creole

Thanks! I'm going to be working on this project this evening, so I'll give your code a try. I'm all for anything that is more compact & to the point . . . .

Actually, I've got about 6 or 7 buttons I've got to rig up to have a roll over effect. I'm just trying to expand my knowledge of cool things to do when bulding web sites.

I appreciate your help . . . .


Saz249
I would give the URL, but I haven't uploaded this page yet. I'm still just previewing in IE 5.5

The page I'm doing this for currently has just one static button.

Thanks for replying . . . .

[Rockrz]

There has got to be something very basic I'm missing about this mouseover effect stuff . . . .

Here's the error line I'm getting when I debug....

document[changeImages.arguments[i]].src = eval(changeImages.arguments[i+1] + ".src");

When I ran my MS Macros (Office2000) debugger it said the above line was were the problem was (it was highlighted)

I went ahead and set up a temp page on Geocities in case anybody wants to see how I screwed all this up (I wish I could make money doin that, since I'm so good at it...Lol...)

To go to the temp page CLICK HERE

[Saz]

Maybe I'm barking up the wrong tree here....but you have them all named either home_on or home_off.........surely they should all be different.

Just a thought.

Oh, and Rockrz, don't worry about screwing up........I do it often enough and it took me a while to get my button rollovers to work too!!!

[cckrocks]

The problem is exactly that... each image must have a different name for the javascript to work. It uses those names to build the array, and then uses the name to provide the rollover feature by changing which graphic is being displayed. Give each image a unique name, and you should be set to go.

[Rockrz]

OK...

So I should name it something like the .gif image is named?

I'll experiment with it & see what I come up with...... Thanks!

[Rockrz]

I went and gave each one it's own unique name & it still isn't working.....

It keeps saying Error: 'document[....]' is null or not an object

I guess I'm going to have to stick this one out for a long time before I can figure out what I'm missing...........

[cckrocks]

Try this site.. http://javascript.internet.com/gener...ad-images.html it has a code maker for perloaded images. All you have to do is enter in the file name and give each file a unique name and it generates WORKING code for you. Try it out. If nothing else, it will help you figure out where your script is going wrong.

[Rockrz]

Cool! I didn't know such a site existed.......I'll go scope it out, Thanks!

[Rockrz]

That is a great feature on that site! I followed the instructions and it worked perfectly!

Now I can see how the code is supposed to be set up when using multiple buttons........

cckrocks you da man!!!

Thanks for all the help....I appreciate it very much

peace,
Rockrz

[cckrocks]

No prob, glad I could help.