.CSS/javascript based tab menu... so close!!!! 1

[rockyroad]

Hello,

I am building a .CSS based menu based on two tutorials I have found.. the first is:

http://www.alistapart.com/articles/slidingdoors/

...which I referenced for building the tab's graphics... but this tutorial didn't delve into the javascript/dhtml aspect of the navigation... for this I referred to:

http://www.dynamicdrive.com/dynamicindex1/ddtabmenu.htm

Using these as a guide a built the following:

http://www.studiocb.net/test/tab_tester2.html

which is almost exactly what I need, except for one problem... on the currently selected tab, the right side of the "sliding door" bg image is changing per the .CSS ...

#tablist li a.current{
background-image:url("right_on.gif");
margin-bottom:1px;
}

... however, I need the left side bg image to change as well, but the code I have doesn't do the trick

#tablist li.current{
/* background: #f7f7f7; */
background-image:url("left_on.gif");
margin-bottom:1px;
}

... so i am stumped...what am I missing here?

does anyone have any ideas how to solve this one?

Thanks! RR

 

[Vragabond]

You're missing the fact that your left side changes when you apply .current class to your <li> element. And you only apply that class to the <a> element. To turn that on, you simply need to add [tt]aobject.parentNode.className = "current"[/tt] at the end of your highlighttab function. However, you will still need to turn this current off for the rest of the elements. You could do the same, but I don't know how smart that is. That would require changing your function to look like this altogether:

function highlighttab (aobject)
{
  if (typeof tabobjlinks=="undefined")
    collecttablinks()
  for (i=0; i<tabobjlinks.length; i++)
  {
    tabobjlinks[i].className=""
    tabobjlinks[i].parentNode.className=""
  }
  aobject.className="current"
  aobject.parentNode.className = "current"
}

 

[Vragabond]

Hi RockyRoad,

did you get your issue resolved?

 

[rockyroad]

Vragabond,

Yes, thank you. Sorry it took so long to reply, I had some personal matters to attend to. Thanks again.

Charles