PDA

View Full Version : Tab Content Script - "current" tab question



trichins
10-18-2005, 08:37 PM
Script: Tab Content Script
http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm

For the most part, the Tab Content Script works very well, except for identifying the current tab.

The style sheet has the following rule:


#tablist li a.current{
background: lightyellow;
}

...and the HTML code has the following:


<ul id="tablist">
<li><a href="http://www.dynamicdrive.com" class="current" onClick="return expandcontent('sc1', this)">Dynamic Drive</a></li>
<li><a href="new.htm" onClick="return expandcontent('sc2', this)" theme="#EAEAFF">What's New</a></li>

It appears that the class="current" is hardcoded and not dynamically asigned by the script. Is that intentional? So the first tab (id=sc1) is always assigned the "current" class identifer?

I would like to be able to style the current or active tab, but am not able to with the code as it is. I would like to know if this is an oversight or intentional. If it's an oversight, any idea how to fix it?

Thank you!

ddadmin
10-19-2005, 07:46 AM
Hi:
By design, the style of the current active tab (ie: its background color) also spills over to the content beneath it. So for example, if you were to modify:


#tablist li a.current{
background: lime;
}

lime will now not only be the background color of the current active tab, but the content it references as well. This is intentional, to allow the webmaster to easily style an entire tab content. Now, you can specify a theme to change the color for different tabs, but again, this affects both the tab and its content:


<li><a href="hot.htm" onClick="return expandcontent('sc3', this)" theme="#FFE6E6">What's Hot</a></li>

This behavior above is by design. I can look into updating this script to support highlight only by tabs, and not the tab contents as well if the demand is there.

trichins
10-19-2005, 01:27 PM
Thank you for the reply. I understand now - the style sheet rule comes into effect if no theme is applied. I was looking for a way to not show a bottom border for the active tab and couldn't make it work properly because the tab themes were over-riding the style sheet. I think the script is fine as is.

Thanks!

trichins
10-19-2005, 04:54 PM
One more question -- how can I modify the script to make the bottom border of the tabs the same as the "theme" color? That way I can have the tabs and the content the same color without a border under the active tab.

Thank you for your consideration.