The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

Reply to this topicStart new topic
> Highlight in Menu
post Aug 11 2010, 12:18 PM
Post #1

Group: Members
Posts: 1
Joined: 11-August 10
Member No.: 12,481

I am totally new to web design so please forgive my lack of "professional" vocab lol. In my site, when you click on an option on my menu bar on the right side the menu option is highlighted once you reach that page. For example, if I click "English Language Arts" I am taken to the English Language Arts page and English Language Arts is then highlighted on the right side. I have subpages linked on each page, when I click on of the subpages (Grade 1 is the only one I am working with right now) within the English Language Arts section it takes me to that page, but instead of having English Language Arts highlighted in the menu it highlights home. I have dug through the HTML, but I can't figure out how to change it even though I am sure it is simple! Can anyone help?

Link to site:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "">
<html xmlns="" xmlns:php="" lang="en"><head xmlns=""><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=7"><meta name="Generator" content="Yahoo! Site Solution - galaga"><meta name="DESCRIPTION" id="mDescription" content="Under Construction"><meta name="KEYWORDS" id="mKeywords" content="Education, Alabama Interactive Teacher, Home"><link rel="stylesheet" type="text/css" media="screen" id="globalCSS" href=""><link rel="stylesheet" type="text/css" media="screen" id="themeCSS" href=""><link rel="stylesheet" type="text/css" media="screen" id="layoutCSS" href=""><link rel="stylesheet" type="text/css" media="screen" id="extensionsCSS" href=""><script type="text/javascript" src=""></script><script type="text/javascript" src=""></script><script type="text/javascript">
var $D = YAHOO.util.Dom;
var $E = YAHOO.util.Event;
var $A = YAHOO.util.Anim;
var $M = YAHOO.util.Motion;
var $EA = YAHOO.util.Easing;
var $DD = YAHOO.util.DD;
var $C = YAHOO.util.Connect;
var $ = $D.get;

YAHOO.namespace ("Smb.Asteroids.Logger");
YAHOO.Smb.Asteroids.Logger = {
Log : function(e) {
if (typeof console !== 'undefined') {
var $LOG = YAHOO.Smb.Asteroids.Logger.Log;
</script><title>Alabama Interactive Teacher - Home</title></head><body><div id="body"><div id="doc"><div xmlns="" id="hd"><style>
blockquote {margin-right:0;padding-right:0}
</style><div id="hContent"><div id="headerContent" class="editorWrap"><div id="headerZoneElement" class="editable rte flexContent" rel="itemGuid.sit.hc.001"><h1 align="center" style="text-align: center"><font face="verdana,geneva" size="6" style="line-height: normal">Alabama Interactive Teacher</font></h1></div></div></div><div id="hMisc"><div class="contactInfoContainer" style="width:auto;height:auto"><p class="vcard"><br><span class="mailtoWrapper"><a class="email" href="">brandi<wbr>@alabamai<wbr>nteractiv<wbr>eteacher<wbr>.com</a></span></p></div></div></div><div id="wrapper"><div xmlns="" id="navigation"><ul id="mainNav"><li class="active"><a href="/home">Home</a></li> <li><a href="/social_studies">Social Studies</a></li> <li><a href="/english_language_arts">English Language Arts</a></li> <li><a href="/science">Science</a></li> <li><a href="/mathematics">Mathematics</a></li> <li><a href="/health_education">Health Education</a></li> <li><a href="/contact_us">Contact Us</a></li> </ul></div><div xmlns="" id="bd"><div id="pageName"><div id="pageNameContent" class="editorWrap"><div id="pageNameZoneContent" class="editable rte flexContent" rel="itemGuid.homePage.001"><h2>Home</h2></div></div></div><div id="zWrap"><div id="zA"><div class="modWrap"><p align="center" style="text-align: center"><font face="verdana,geneva" size="7" style="line-height: normal">Under Construction</font></p></div></div><div id="zB"><div class="modWrap"></div></div><div id="zC"><div class="modWrap"></div></div></div></div></div><div xmlns="" id="ft"><div id="fWrapper"><div id="fContent"><div id="footerContent" class="editorWrap"><div id="footerZoneElement" class="editable rte flexContent" rel="itemGuid.sit.fc.001"><p>Copyright 2010 Alabama Interactive Teacher. All rights reserved.</p><p><a target="_top" href="">Web Hosting by Yahoo!</a></p></div></div></div><div id="fMisc"><div class="contactInfoContainer" style="width:auto;height:auto"><p class="vcard"><br><span class="mailtoWrapper"><a class="email" href="">brandi<wbr>@alabamai<wbr>nteractiv<wbr>eteacher<wbr>.com</a></span></p></div></div><div id="fBadges"></div></div></div><script xmlns="" language="JavaScript" src=""></script><script xmlns="" language="javascript">geovisit();</script><noscript xmlns=""><img src="" alt="setstats" border="0" width="1" height="1"></noscript></div></div></body><script xmlns="" type="text/javascript"></script><script xmlns="" type="text/javascript" src=""></script></html>

This post has been edited by alabamainteractiveteacher: Aug 11 2010, 12:20 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Aug 11 2010, 01:42 PM
Post #2

WDG Member

Group: Root Admin
Posts: 8,272
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3

The current page uses <li class="active"> and the background is specified in your style sheet with:
        ul#mainNav a:link,
        ul#mainNav a:visited,
        ul#mainNav li a:hover,
        ul#mainNav li a:active,
        ul#mainNav li a:focus {
            background-color: #ff8d37;
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:


- Lo-Fi Version Time is now: 16th August 2018 - 11:35 AM