Page 1 of 1

How can I change the color

Posted: Sat Nov 11, 2006 2:44 pm
by iffo
Hi,

I have this site, you see home in red, It is through css.

http://natradersonline.com/temp/index.php

what i want when I click on some other menu item, it turn red and 'home' goes back to normal color.

Is it possible to change css throght javascript, I have an
onclick even in each menu, i tried something like this , but that gives me error.

Code: Select all

document.getElementById('home1').class= 'first active';
I appreciate your help.

Thanks

Posted: Sat Nov 11, 2006 2:49 pm
by nickvd
Use jQuery, and this code snippet:

Code: Select all

$(document).ready(function(){
  var path=location.pathname.substring(1);
  if(path) $('#navlist a[@href$="'+path+'"]').set('id','current');
});

Posted: Sat Nov 11, 2006 2:50 pm
by feyd
className is the property to alter for changing the CSS class, if memory serves. (Note: it may need to be all lower case, it's been a while.) Otherwise, you would alter the style property.

Posted: Sat Nov 11, 2006 4:19 pm
by mtfoley
semantically, it's best to change className property instead of style. It makes for cleaner code in javascript, and it lets CSS rules take care of the details. If you're going to make changes to an HTML element depending on an application state, and those changes are listed in several places, this would be a nice solution:

Code: Select all

hide(element){
  element.className = 'hidden';
}
show(element){
  element.className = 'shown';
}
and the CSS could be:

Code: Select all

.hidden{
  display:none;
}
.shown{
  display:block;
}