View Full Version : highlight current tab

Peter Johnson
07-10-2007, 04:19 PM
I'm using javascript to change the background color of the current link in a tabbed menu. It works fine.

But I can't figure out how to modify it so that the tab is highlighted on the initial page, when someone first comes to the site. Any help, as always, greatly appreciated.

<style type="text/css">

padding: 2px;
margin: 0;
font: 14px arial;

#tabbedlinks li{
list-style: none;
display: inline;
margin: 0;

#tabbedlinks li a{
text-decoration: none;
padding: 3px 0.5em;
border: 1px solid #000;
border-bottom: none;

#tabbedlinks li a:active {


var highlightLink = function () {
var active = null, color = 'yellow';
if (this.attachEvent) this.attachEvent('onunload', function () {
active = null;
return function (element) {
if ((active != element) && element.style) {
if (active) active.style.backgroundColor = '';
element.style.backgroundColor = color;
active = element;

<ul id="tabbedlinks">
<li><a href="http://www.google.com" target="tabiframe" onclick="highlightLink(this);">Google</a></li>
<li><a href="http://www.yahoo.com" target="tabiframe" onclick="highlightLink(this);">Yahoo</a></li>
<li><a href="http://www.ask.com" target="tabiframe" onclick="highlightLink(this);">Ask</a></li>

<iframe id="tabiframe" name="tabiframe" src="http://www.google.com" width="800" height="350px"></iframe>


Peter Johnson
07-12-2007, 03:53 AM
Anyone have any ideas??? Alternatives???