/    Sign up×
Community /Pin to ProfileBookmark

Rollover fine in FF, mixes images in IE?

I swear I went through about 11 pages of a “rollover” search, and I couldn’t find this specific problem, or if I did, I don’t understand enough about coding to get it.

The offending page is here:
[url]http://performingartscamp.net/template/pearty.html[/url]
The rollover works fine in firefox (the menu “buttons” appear pressed), but in IE, not only do they not work, but the first image hops to the last one and stretches out.
I have been over and over the code, and I guess I can’t see the forest from the trees anymore.

The offending code is here:

[CODE]<script language=”JavaScript”>

function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a && i < a.length && (x=a[i]) && x.oSrc;i++)
x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i < a.length; i++)
if (a[i].indexOf(“#”)!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document; if((p=n.indexOf(“?”))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i < d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i < d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

</script>
</HEAD>
<BODY BGCOLOR=#B2A489 MARGINHEIGHT=0 onLoad=”MM_preloadImages(‘images/buttonpress_03.gif’,’images/buttonpress_04.gif’,’images/buttonpress_05.gif’,’images/buttonpress_06.gif’)”>
<font style=”font-size: 10pt” face=”Georgia”>
<TABLE WIDTH=780 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD COLSPAN=5>
<IMG SRC=”images/PSbanner_01.gif” WIDTH=780 HEIGHT=206 ALT=””></TD>
</TR>
<TR>
<TD>
<IMG SRC=”images/PSbanner_02.gif” WIDTH=215 HEIGHT=41 ALT=””></TD>
<TD>
<a href=”aboutus.html” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(’03’,”,’images/buttonpress_03.gif’,1)”><IMG SRC=”images/PSbanner_03.gif” WIDTH=104 HEIGHT=41 ALT=”” border=0 name=”03″></a></TD>
<TD>
<a href=”myreferences.html” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(’04’,”,’images/buttonpress_04.gif’,1)”><IMG SRC=”images/PSbanner_04.gif” WIDTH=137 HEIGHT=41 ALT=”” border=0 name=”04″></a></TD>
<TD>
<a href=”ourprocess.html” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(’05’,”,’images/buttonpress_05.gif’,1)”><IMG SRC=”images/PSbanner_05.gif” WIDTH=112 HEIGHT=41 ALT=”” border=0 name=”05″></a></TD>
<TD>
<a href=”sampleapp.html” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(’06’,”,’images/buttonpress_06.gif’,1)”><IMG SRC=”images/PSbanner_06.gif” WIDTH=212 HEIGHT=41 ALT=”” border=0 name=”06″></a></TD>
</TR>[/CODE]

I think the stuff in the script tag is supposed to be commented out with <!– –>s, but when I take them out, IE doesn’t work at all. I have also (thanks to the search) tried replacing “name” with “id,” to no avail.

Also: I originally got this code from Dreamweaver back in the day.
Another weird thing is that this same code was used on this page:
[url]http://www.honeybeemanor.com/rolltest.html[/url]
And that works FINE in IE!
(Please ignore the images…I made that as a test page for a friend of mine.)

Okay, I’m done. Thank you in advance for all your help!

to post a comment
JavaScript

6 Comments(s)

Copy linkTweet thisAlerts:
@FangMar 06.2006 — It's the image names; IE is reading 03 as 3. Use name values that do not begin with zero.

http://www.w3.org/TR/html401/types.html#type-id
Copy linkTweet thisAlerts:
@BronLMar 06.2006 — Hi

I hate to suggest it, but is it possible there's an issue with your image naming and/or browser cache? (sorry - the code looks fine). The only thing that I can think of that would explain what you're describing is if you had inadvertently had 06 instead of the first 03 in this line:

<a href="aboutus.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('03','','images/buttonpress_03.gif',1)"><IMG SRC="images/PSbanner_03.gif" WIDTH=104 HEIGHT=41 ALT="" border=0 name="03"></a>

Otherwise... you're sure all your image names across the entire page are unique?

I copied the JS from an existing DW page of mine, and the javascript was almost identical except that I have a more recent version of :

function MM_findObj(n, d) { //v4.01

var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

if(!x && d.getElementById) x=d.getElementById(n); return x;

}



BTW the rollovers work fine on IE on Mac. Sorry - I don't think I've been much help, but at least you know there's nothing wrong with the script in the head part of your page.



good luck
Copy linkTweet thisAlerts:
@BronLMar 06.2006 — Hi Fang

Does IE (or is it these MM scripts) evaluate these names, even wrapped in quotes?
Copy linkTweet thisAlerts:
@laurenkitsuneauthorMar 06.2006 — Yee-hah! Fang's suggestion worked.

Thanks so much!

I changed them all to numbers not beginning with zero, and that didn't really work, so I just assigned them regular names. Worked like a charm!

And BronL, I'm also glad to hear it works on a Mac, since that's what my client's using!

Thanks again!
Copy linkTweet thisAlerts:
@FangMar 06.2006 — Read the link I gave: first character of name/id value must be alphabetic.
Copy linkTweet thisAlerts:
@laurenkitsuneauthorMar 06.2006 — Yes, I had it open in a tab, but I was too eager to fix the code according to your "use name values that do not begin with zero" advice.

I got to it after I'd replied and saw my mistake. Thanks again.
×

Success!

Help @laurenkitsune spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...