Frames and Classes

[Tyrone Slothrop]

I have a web page with two frames, navigation and content. The nav
uses classes like so
<td align="center"
id="main"
style="cursor:pointer;"
onClick="parent.main.location.href='main.html'"
onMouseOver="this.className='nav0'"
onMouseOut="this.className='nav1'"
class="nav0">Main Page</td>

The class nav1 is the default state.
The class nav0 is the "lit" state.

What I need to do is make the "button" light up when a given page is
loaded and remain that way.

OnLoad of main.html, I can do:
onLoad="parent.frames['nav'].document.getElementById('main').className='nav0'"

Of course, once the mouse passes over the button, onMouseOut it
returns to the default state.

Is there a way to make the "lit" state persist?

While I am writing this, a possibility has crossed my mind. The
location of the content frame can evaluated and return the proper
class:

onMouseOut="
if (parent.content.href.indexOf('main')) {
this.className='nav0';
} else {
this.className='nav1';
}"

Or am I mixing JS and DHTML? My specialties are PHP and Perl and I am
into my 16th hour today. The words blur and sleep beckons. ;-)

TIA for any assistance!

Tom (aka Tyrone Slothrop)

[Stephen Chalmers]

Tyrone Slothrop <[e-mail]> wrote in message
news:89********************************@4ax.com...

I have a web page with two frames, navigation and content. The nav
uses classes like so
<td align="center"
id="main"
style="cursor:pointer;"
onClick="parent.main.location.href='main.html'"
onMouseOver="this.className='nav0'"
onMouseOut="this.className='nav1'"
class="nav0">Main Page</td>

The class nav1 is the default state.
The class nav0 is the "lit" state.

What I need to do is make the "button" light up when a given page is
loaded and remain that way.

OnLoad of main.html, I can do:
onLoad="parent.frames['nav'].document.getElementById('main').className='nav0
'"
Of course, once the mouse passes over the button, onMouseOut it
returns to the default state.

Is there a way to make the "lit" state persist?

While I am writing this, a possibility has crossed my mind. The
location of the content frame can evaluated and return the proper
class:

onMouseOut="
if (parent.content.href.indexOf('main')) {
this.className='nav0';
} else {
this.className='nav1';
}"

It would be less hideously written as:
onMouseOut="this.className=(parent.content.href.in dexOf('main')>-1?'nav0':'n
av1'";

Better still, don't write it at all.

Put this code in your navigation page:
------------
var linkIndex=0; // or set to another initial value

for(var i=0,len=document.links.length; i<len; i++) // assign all link
mouseout events
document.links[i].onmouseout=function(){setLink(linkIndex)}

function setLink(n)
{
linkIndex=n;

for(var i=0,ll=document.links.length; i<ll; i++)
document.links[i].className=(n==i)?'nav1':'nav0';
}

setLink( linkIndex ) ;
----------

Then each content page would call setLink with a unique index:

parent.frames['nav'].setLink( 2 ); // In page corresponding to third link

--
S.C. http://makeashorterlink.com/?H3E82245A