Click here to Skip to main content
15,311,104 members
Home / Discussions / Web Development
   

Web Development

 
AnswerRe: Name of the file/form that called / or included an html document. Pin
TheGreatAndPowerfulOz25-Jan-11 9:48
MemberTheGreatAndPowerfulOz25-Jan-11 9:48 
GeneralRe: Name of the file/form that called / or included an html document. Pin
Douglas Kirk25-Jan-11 9:50
MemberDouglas Kirk25-Jan-11 9:50 
AnswerRe: Name of the file/form that called / or included an html document. Pin
Gerben Jongerius25-Jan-11 20:00
MemberGerben Jongerius25-Jan-11 20:00 
QuestionConsole-style home page? Pin
dszarkow25-Jan-11 2:32
Memberdszarkow25-Jan-11 2:32 
AnswerRe: Console-style home page? Pin
Richard MacCutchan25-Jan-11 3:06
mveRichard MacCutchan25-Jan-11 3:06 
GeneralRe: Console-style home page? Pin
dszarkow25-Jan-11 3:20
Memberdszarkow25-Jan-11 3:20 
GeneralRe: Console-style home page? Pin
Richard MacCutchan25-Jan-11 3:28
mveRichard MacCutchan25-Jan-11 3:28 
QuestionChanging the CSS properties of a menu bar Pin
Douglas Kirk24-Jan-11 21:35
MemberDouglas Kirk24-Jan-11 21:35 
Hello,

I have a simple menu bar base on a ul li list with embedded hyperlinks.
<ul>    
    <li id="menuHome"><a href="index.html" onMouseOver="setMenu('menuHome')" >Home</a></li>    
    <li id="menuResults"><a href="results.htm">Results</a></li>    
    <li id="menuEvents"><a href="events.htm">Events</a></li>
</ul>


I have set the CSS properties such as

#menuHome {
    background-color: #CCC;
    color: #000;
}

#navleft ul {
    list-style: none;
    padding: 0;
    margin: 0 0 5px 0 ;
    text-align: left;
}

#navleft li {
    margin: 5px 0;
    line-height: 23px;
}

#navleft li a {	
    text-decoration: none;
    padding-left: 9px;
    display: block;
    width: 140px;
}


My Java script is quite basic

function setMenu( id )
{    
    var e = document.getElementById(id);    
    e.style.backgroundColor = 0x666666;    
    e.style.color = 0xFFFFFF;
}


My goal is to basically have a vertical menu bar that can be used for multiple webpages, so that after the user clicks on it, it will change the background color and text to a different color, so that it is apparent which page the user is on.
(I realize that I'm using the mouse hover for testing, it stops the page from reloading every time I test it).


The problem that I am having, if my understanding is corrent is that the tag that I pass in the jave call is bond to the "li" element of the menu list, the background color changes quite fine, but, I can not seem to be able to access the color property of the "a href" tag to change the text from black to white.

using the e.style example above how would to "Cast it" to the a reference?

Thank you in advance.
AnswerRe: Changing the CSS properties of a menu bar Pin
Gerben Jongerius25-Jan-11 0:27
MemberGerben Jongerius25-Jan-11 0:27 
GeneralRe: Changing the CSS properties of a menu bar Pin
Douglas Kirk25-Jan-11 0:52
MemberDouglas Kirk25-Jan-11 0:52 
GeneralRe: Changing the CSS properties of a menu bar Pin
Gerben Jongerius25-Jan-11 3:59
MemberGerben Jongerius25-Jan-11 3:59 
QuestionLooking for development resources and suggestions Pin
Gregory Gadow24-Jan-11 6:21
MemberGregory Gadow24-Jan-11 6:21 
AnswerRe: Looking for development resources and suggestions Pin
David Mujica24-Jan-11 7:48
MemberDavid Mujica24-Jan-11 7:48 
GeneralRe: Looking for development resources and suggestions Pin
fjdiewornncalwe24-Jan-11 8:57
professionalfjdiewornncalwe24-Jan-11 8:57 
GeneralRe: Looking for development resources and suggestions Pin
Gregory Gadow24-Jan-11 11:00
MemberGregory Gadow24-Jan-11 11:00 
GeneralRe: Looking for development resources and suggestions Pin
Not Active24-Jan-11 11:59
mentorNot Active24-Jan-11 11:59 
AnswerRe: Looking for development resources and suggestions Pin
Peter_in_278024-Jan-11 12:18
professionalPeter_in_278024-Jan-11 12:18 
QuestionStrange file download issue Pin
SomeGuyThatIsMe24-Jan-11 3:29
MemberSomeGuyThatIsMe24-Jan-11 3:29 
QuestionA little Urgent: Apx (Html ) Rendering problem in Browser :Chrome Pin
T1000_20-Jan-11 16:55
MemberT1000_20-Jan-11 16:55 
AnswerCross post Pin
Not Active20-Jan-11 17:08
mentorNot Active20-Jan-11 17:08 
QuestionHow to Remove Spurious Row Padding in Table Pin
Patrick Skelton14-Jan-11 23:56
MemberPatrick Skelton14-Jan-11 23:56 
AnswerRe: How to Remove Spurious Row Padding in Table Pin
TweakBird21-Jan-11 1:20
MemberTweakBird21-Jan-11 1:20 
QuestionRe: How to Remove Spurious Row Padding in Table Pin
Patrick Skelton24-Jan-11 7:13
MemberPatrick Skelton24-Jan-11 7:13 
AnswerRe: How to Remove Spurious Row Padding in Table Pin
TweakBird24-Jan-11 8:26
MemberTweakBird24-Jan-11 8:26 
AnswerRe: How to Remove Spurious Row Padding in Table Pin
Luc Pattyn24-Jan-11 9:05
sitebuilderLuc Pattyn24-Jan-11 9:05 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.