[thelist] A:Active Working Example?

Mon Feb 24 13:44:01 CST 2003

On Mon, Feb 24, 2003 at 01:06:48PM -0600, Rob Smith wrote:
> There was a topic a few days ago about highlighting the active or currently
> link you're on, but it really wasn't answered to my satisfaction. After
> researching the a:active css property, I realized that this is what happens
> on the press state of the mouse click.

I'm not sureif it was the thread I start but here's something I knocked up
following stuff on this mailing list:

Basically just changes the class of the currentlink you're on to 'currentlink'

_very_ useful for navbars. (:

- Kevin

// JavaScript Highlight Current link.
// Link this js document, then call it in the body tag:
// <body onload="highlightCurrentLink()" >

// Based on Inigo Surguy's version at:
// http://www.surguy.net/menu/highlight.html
// Modified by Kevin Cannon  http://www.multiblah.com

// Get's the URL and parses it
function getURL() {
  var url = document.location.href;
  return parseURL(url);
}

// Strips a URL to just the filename
function parseURL (url) {
  var fileName = url.split("/");
  fileName = (fileName[fileName.length-1]);
  return fileName;
}

// Searches through the doc looking for links
// Only checks the navigation ID
// Changes class of the current link to /currentlink
function highlightCurrentLink() {

  var currentLocation = getURL();
  var nav = document.getElementById("navigation");

  //alert ("currentLocation" + currentLocation);
  links = nav.getElementsByTagName("a");

  for (i=0; i<links.length; i++) {

    linkHref = links[i].getAttribute("href")
	linkHref = parseURL(linkHref);
	//alert("linkHref" + linkHref);

    if (linkHref==currentLocation) {
	  //alert("link found");

	  // Set class for different browsers
      links[i].setAttribute("className", "currentlink");
	  links[i].setAttribute("class", "currentlink");

   }

  }
}