CSS in need of javascript ?

[sebas]

Dear Devppl,

I made a navigation system supported by CSS.
Links in my left navigation bar change due to a{}, a:hover{} and a:active{} in a style sheet. Now I would like to know if anyone knows a way to set a certain link as "active" when the page is loaded (body OnLOad...).
So that it's clear that the first menu-item is already loaded in the right frame.

I suspect Javascript is needed.

Many thx !

Sebas

[Fruitcake]

i haven't seen many ways of doing this but the only way i could think of without using javascript is use php to dynamically add a style rule to the individual link that is currently visited.

[GoDs^GifT]

i would help but i dont even know wot css is let alone how to use so im sorry but i will try and find my friend aand make him sign up on the forums he makes great web sites etc and i bet he knows how to help you

[webmaster]

Fruitcake is right you could use a PHP script that checks the current site you are visiting, and then change the style for a link, but there is probably some css function for it.

[sheldon]

I'm not sure, but I suspect you're looking for a way of making a certain link appear "active" in a navigation bar or frame. I use this as a general purpose script, calling it from the navigation frame links with the onclick event, like so:

Code: Select all

<a href="thatPage" target="myFrame" onclick="selectLink(document.anchors[0])"

and here's the script:

Code: Select all

<script language="javascript" type="text/javascript">
  var currentSelection;
  function selectLink(newSelection) {
    /*reset previously selected link*/
    if (currentSelection){
      currentSelection.style.fontWeight='normal';
    }
    newSelection.style.fontWeight='bold';
    newSelection.hideFocus=true; /*Hide selection border*/
    currentSelection=newSelection;
    try{
      document.parent.getElementById('myFrame').focus();
      }
    catch(e){ /*some browsers don't support focus*/
      ;
    }
}
</script>

If this is what you're looking for then include the script in your navigation frame and trigger it with an

Code: Select all

onLoad

event.

One tricky aspect I haven't yet found a great solution to is that I can't reference the anchors by name (like

Code: Select all

selectLink(this)

or

Code: Select all

selectLink('guestbook')

). I'm forced to access the anchor array by numerical index (above I'm selecting the first anchor on that page), and that makes moving things really awkward. Maybe somebody else can shed some light on that issue?
Good luck, hope this helps.
/shel

[sebas]

Thank you all for your time, I will try this script, and keep you posted...

Bye,

Sebas