1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

document.getElementById Change a href style?

Discussion in 'JavaScript' started by cocoMonkey, Oct 29, 2007.

  1. #1
    Alright guys,

    Im using this code to change the style of a div:

    document.getElementById("holder").style.background = "#ccccccc";

    This is working great.

    BUT

    i want to also change the way the links appear, i imagined it would be this:

    document.getElementById("holder a").style.background = "#ccccccc";

    But its not.

    im basicly trying to dynamically change:

    .holder a {
    background-color:#CCCCCC;
    }


    Any help on how to do this would be sweet.

    Cheers.
     
    cocoMonkey, Oct 29, 2007 IP
  2. ajsa52

    ajsa52 Well-Known Member

    Messages:
    3,426
    Likes Received:
    125
    Best Answers:
    0
    Trophy Points:
    160
    #2
    Try this:

    document.getElementById("holder").className='newclass';
     
    ajsa52, Oct 29, 2007 IP
    cocoMonkey likes this.
  3. cocoMonkey

    cocoMonkey Active Member

    Messages:
    305
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    58
    #3
    ajsa52!!! Thanks so much!!

    That worked perfectly!

    Cheers. :)

    Rep given.
     
    cocoMonkey, Oct 30, 2007 IP
  4. partha_baba

    partha_baba Peon

    Messages:
    1
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Could you please explain the solution? I am in the similar situation and still in dark with the solution above :eek:
     
    partha_baba, Apr 30, 2009 IP
  5. dimitar christoff

    dimitar christoff Active Member

    Messages:
    882
    Likes Received:
    62
    Best Answers:
    0
    Trophy Points:
    90
    #5
    he defines a clas in css, like .holder a {
    background-color: #ccc;
    }

    on the event, he adds the classname to parent element which then makes the pseudo selector .holder a work.

    if you use a framework like mootools or jquery, you can actually reference the anchor links directly:

    
    // this in the context of a function  run on mouseover on holder... 
    this.getElements("a").setStyles({background: '#ccc',color: 'red'});
    
    // a more generic one for all links
    $$("div.holder a")
    
    // just 1
    $E("div.holder a") // same as $$("div.holder a")[0]
    this.getElement("a");
    this.getFirst(); // if it is first :D
    
    // all secure anchor links with href="https*" (starting with)
    this.getElements("a[href^=https]");
    
    PHP:
    etc etc. go on, get a framework :)
     
    dimitar christoff, May 1, 2009 IP