windandwaves wrote:
kaeli wrote: In article <42********@cle ar.net.nz>, wi*********@col dmail.com
enlightened us with... Hi Gurus
I have a little javascript that works perfectly in IE (for a
change), but does not work in Firefox and Opera (no errors
though)...
Worked in my Firefox. FF 1.0
What version are you using?
Always include versions for browsers.
You can see the script in action at www.tupelo.co.nz by moving
your mouse over the little thumbnails below the big image.
The images changed just fine for me.
What happened for you?
The big ones changed but the little ones (over which you move the
mouse) should also change (lighten a little), sorry, it seems that I left
out some important info.
I use Mozilla/5.0 (Windows; U; Windows NT 5.1; en-GB; rv:1.7.7)
Gecko/20050414 Firefox/1.0.3
Cheers
Hi w&w.
What's with all that scripting? Remember "ye olde rollover"? Still
works pretty well. No sense going DOM-crazy if unnecessary, particular
ona commercial site.
Also: that 'eq' thing can be done easily with HTML/CSS. Easier to
modify as well. Replace this (in your stylesheet):
DIV#equa { height: 20px; margin-bottom: 7px;}
....with this:
DIV#equa { margin-bottom: 7px;}
DIV.eq { width: 15px; height: 15px; float: right; margin-left: 3px;
background: #fff; }
DIV.eq-active { width: 15px; height: 15px; float: right; margin-left:
3px; background: #f2cf77; }
Then:
<BODY ONLOAD="loadima ges();">
<DIV ID="main">
<TABLE CELLSPACING="0" CELLPADDING="0" BORDER="0" ID="logm">
<TR>
<TD ID="logo"><IMG ID="ilogo" SRC="i/logo.gif" ALT="TUPELO BAR ///
Wellington oldest lounge and cocktail bar" TITLE="TUPELO BAR ///
Wellington oldest lounge and cocktail bar"></TD>
<TD ID="menu">
<DIV ID="equa">
<div id="eq6" class="eq"></div>
<div id="eq5" class="eq"></div>
<div id="eq4" class="eq"></div>
<div id="eq3" class="eq"></div>
<div id="eq2" class="eq"></div>
<div id="eq1" class="eq" style="backgrou nd:#f29c01;"></div></DIV>
<DIV ID="menb">
ABOUT
<A HREF="gigs.php? PHPSESSID=d46e1 14f6b68a94a295f d0da9b286f9d"
ONMOUSEOVER="re turn doClass(2,'eq-active');"
ONMOUSEOUT="ret urn doClass(2,'eq') ;">GIGS</A>
<A HREF="menu.php? PHPSESSID=d46e1 14f6b68a94a295f d0da9b286f9d"
ONMOUSEOVER="re turn doClass(3,'eq-active');"
ONMOUSEOUT="ret urn doClass(3,'eq') ;">MENU</A>
<A HREF="drinks.ph p?PHPSESSID=d46 e114f6b68a94a29 5fd0da9b286f9d"
ONMOUSEOVER="re turn doClass(4,'eq-active');"
ONMOUSEOUT="ret urn doClass(4,'eq') ;">DRINKS</A>
<A HREF="functions .php?PHPSESSID= d46e114f6b68a94 a295fd0da9b286f 9d"
ONMOUSEOVER="re turn doClass(5,'eq-active');"
ONMOUSEOUT="ret urn doClass(5,'eq') ;">FUNCTIONS </A>
<A HREF="bookings. php?PHPSESSID=d 46e114f6b68a94a 295fd0da9b286f9 d"
ONMOUSEOVER="re turn doClass(6,'eq-active');"
ONMOUSEOUT="ret urn doClass(6,'eq') ;">CONTACTS</A>
</DIV>
<DIV ID="mens">
</DIV>
</TD>
</TR>
</TABLE>
<TABLE CELLSPACING="0" CELLPADDING="0" Border="0" ID="copy">
<TR>
<TD ID="mail">
<FORM METHOD="post" ACTION="thankyo u.php" ID="frm"><inpu t type="hidden"
name="PHPSESSID " value="d46e114f 6b68a94a295fd0d a9b286f9d" />
<P ID="join">Join the Tupelo maling list
<INPUT TYPE="text" NAME="email" ID="email">
<INPUT TYPE="submit" VALUE="join" CLASS="submit" NAME="join">
</P>
</FORM>
</TD>
<TD ID="head">
<H1>ABOUT /// <SPAN ID="heex">THE VENUE</SPAN></H1>
</TD>
</TR>
<TR>
<TD ID="picL">
<DIV ID="LP"><IMG SRC="i/L/exa.jpg" CLASS="Lpic" ALT="large pic"
TITLE="large pic" NAME="Lpic" WIDTH="320" HEIGHT="215"></DIV>
<IMG SRC="i/S/i1n.jpg" NAME="s1" CLASS="Spic" ALT="small pic"
TITLE="small pic"
ONMOUSEOVER="re turn iRoll('s1','i/S/i1o.jpg','Lpic' ,'i/L/i1.jpg');"
ONMOUSEOUT="ret urn iRoll('s1','i/S/i1n.jpg');">
<IMG SRC="i/S/i2n.jpg" NAME="s2" CLASS="Spic" ALT="small pic"
TITLE="small pic"
ONMOUSEOVER="re turn iRoll('s2','i/S/i2o.jpg','Lpic' ,'i/L/i2.jpg');"
ONMOUSEOUT="ret urn iRoll('s2','i/S/i2n.jpg');">
<IMG SRC="i/S/i3n.jpg" NAME="s3" CLASS="Spic" ALT="small pic"
TITLE="small pic"
ONMOUSEOVER="re turn iRoll('s3','i/S/i3o.jpg','Lpic' ,'i/L/i3.jpg');"
ONMOUSEOUT="ret urn iRoll('s3','i/S/i3n.jpg');">
<IMG SRC="i/S/i4n.jpg" NAME="s4" CLASS="Spic" ALT="small pic"
TITLE="small pic"
ONMOUSEOVER="re turn iRoll('s4','i/S/i4o.jpg','Lpic' ,'i/L/i4.jpg');"
ONMOUSEOUT="ret urn iRoll('s4','i/S/i4n.jpg');">
<IMG SRC="i/S/i5n.jpg" NAME="s5" CLASS="Spic" ALT="small pic"
TITLE="small pic"
ONMOUSEOVER="re turn iRoll('s5','i/S/i5o.jpg','Lpic' ,'i/L/i5.jpg');"
ONMOUSEOUT="ret urn iRoll('s5','i/S/i5n.jpg');">
<IMG SRC="i/S/i6n.jpg" NAME="s6" CLASS="Spic" ALT="small pic"
TITLE="small pic"
ONMOUSEOVER="re turn iRoll('s6','i/S/i6o.jpg','Lpic' ,'i/L/i6.jpg');"
ONMOUSEOUT="ret urn iRoll('s6','i/S/i6n.jpg');">
.........
.........
[formatting removed]
Change 'j.js' -
var pix = [
'i/S/i1o.jpg' ,
'i/S/i2o.jpg' ,
'i/S/i3o.jpg' ,
'i/S/i4o.jpg' ,
'i/S/i5o.jpg' ,
'i/S/i6o.jpg' ,
'i/L/i1.jpg' ,
'i/L/i2.jpg' ,
'i/L/i3.jpg' ,
'i/L/i4.jpg' ,
'i/L/i5.jpg' ,
'i/L/i6.jpg'
];
function loadimages()
{
for (var n, i = 0, l = pix.length; i < l; i++)
{
pix[(n = l + i)] = new Image();
pix[n].src = pix[i];
}
}
function iRoll()
{
for (var i = 0, l = arguments.lengt h; i < l; i += 2)
document.images[arguments[i]].src = arguments[i + 1];
}
function doClass(n, cname)
{
var el;
if (document.getEl ementById
&& (el = document.getEle mentById('eq' + n)))
{
el.className = cname;
}
return true;
}
function OW(fln){
...........
...........
Cheers, Rob.