Javascript Rollover - rollover does not function cleanly
I am using Fireworks to slice a gif and create a rollover. It generated the Java for you. Problem is that onmouseoff the frame does not revert to the normal layer. The onmouseover layer still shows. I have tried contacting their tech team, but they are graphics hacks, not programmers. I have run thru the script and can not put my finger on it. You can see the script in action at:
http://www.connex-electronics.com/_private/topbarRollover.html
It is for my other site, but that site is still locked off.
Thanks!
----------
Alan Izat
tazman posted this at 01:48 — 25th June 1999.
They have: 99 posts
Joined: May 1999
Thanks John,
If you get a chance, it would be appreciated!
Thanks again
----------
Alan Izat
John Pollock posted this at 03:21 — 25th June 1999.
He has: 628 posts
Joined: Mar 1999
The onMoueout command in the link tag doesn't make a call to a fuvtion to switch back the image. It just calls one that removes a message from the status bar. I only saw a function for the initial switch.
If I get a chance, I'll see if I can add that in for you.
----------
John Pollock
http://www.pageresource.com
Java Script: A Beginner's Guide
Page Resource
Anonymous posted this at 04:57 — 26th June 1999.
They have: 5,633 posts
Joined: Jan 1970
First of all never trust the JavaScript generated by web design programs - you should always type it yourself for best results.
If you follow my code below, you will need to re-type a fair bit of your existing code.
1.Add this code between the HEAD tags
<script language="JavaScript">
<!-- hide script from old browsers
// DECLARE THE 3 DIFFERENT STATES OF YOUR BUTTON
// DO SO FOR ALL YOUR IMAGES (6?)
if (document.images) {
NAME_over = new Image(); NAME_over.src = "URL";
NAME_out = new Image(); NAME_out.src = "URL";
NAME_down = new Image(); NAME_down.src = "URL";
}
// THESE FUNCTIONS CALL THE DIFFERENT IMAGES FOR EACH STATE THAT THE BUTTON CAN BE
// WHERE THE STUPID FACES APPEAR, THEY SHOULD BE CLOSING BRACKETS eg. )
function mouseOver(imgName) {
if (document.images) {
document[imgName].src=eval(imgName + "_over.src");
}
}
function mouseOut(imgName) {
if (document.images) {
document[imgName].src=eval(imgName + "_out.src");
}
}
function mouseDown(imgName) {
if (document.images) {
document[imgName].src=eval(imgName + "_down.src");
}
}
// end hiding from old browsers -->
</script>
2.Use this code for your images
<a href="URL"
onMouseOver="mouseOver('NAME')"
onMouseOut="mouseOut('NAME')"
onMouseDown="mouseDown('NAME')"
onMouseUp="mouseOver('NAME')"><img
src="URL"
name="NAME"
border="0" height="" width=""></a>
Notes:
-Make sure you give a unique name to each image
Now I have not tested this script but if you give it a go and still have trouble, just reply again to this discussion or email me
----------
[email protected]
vegas.com.au/~jasper
tazman posted this at 21:44 — 27th June 1999.
They have: 99 posts
Joined: May 1999
Thanks for the help. I will give it a shot...I'll post how it goes.
Alan Izat
----------
Alan Izat
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.