I have a pretty standard navigation for a website. The main navigation is a ul, with several nested ul’s. I’m basically just wanting to dynamically disable a link when the user is already on that page.
So if I’m on the home page, the home page link needs to be disabled. If I’m on the contact page, the contact page link needs to be disabled.
I am not wanting to delete the link entirely, just remove the href from the anchor or just make the anchor itself de-activated. Is there a fast, slick and elegant solution for this in XHTML, CSS, JavaScript or php. I’d also want a solution that’s friendly across the board, not just for modern browsers (you can read, IE 6).
I did think of setting a path variable on each page, and then having an if statement for each link, but that seems horribly tedious and stupid. But hey, it would get the job done.
I think it would be best to do this in the page generation code (i.e. PHP), iterating through each link and removing the
<a>tag, replacing it with a<span>or something similar if the link matches the criteria for matching the current page. PHP gives you this current page (in various flavors:$_SERVER['REQUEST_URI'],$_SERVER['SCRIPT_FILENAME'],$_SERVER['PHP_SELF'],$_SERVER['QUERY_STRING'], etc.) in its base, and using these, you can determine an algorithm to match your page.