document.getElementById problem

•

What is DaniWeb IT Discussion Community?

You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 374,181 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 3,414 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.

Join our community!

Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting

Thread Tools Display Modes

Views: 1920 | Replies: 11 | Solved

Page 2 of 2

•

Join Date: Jul 2006

Location: Deptford, London

Posts: 916

Reputation: MattEvans will become famous soon enough

Rep Power: 5

Solved Threads: 46

MattEvans

Offline

Posting Shark

Re: document.getElementById problem

#11

Feb 27th, 2008

Alternatively, try this trick, if you don't mind presetting the available colors ( in a way, it's better because those colours can be defined in the CSS ). This works by dynamically changing the class of the containing element, the CSS 'cascade' effect sorts out the rest:

Help with Code Tags

(Toggle Plain Text)

<html>
  <head>
    <title>Color changing magic with a classname trick</title>
    <style type="text/css">
      div.red_links a
      {
        color:red;
      }
      div.blue_links a
      {
        color:blue;
      }
    </style>
    <script type="text/javascript">
      function set_linkcolor( to )
      {
        document.getElementById( "color_state" ).className = 
              to + "_links";
      }
    </script>
  </head>
  <body>
    <div id="color_state" class="red_links">
      <ul>
        <li><a>An anchor</a></li>
        <li><a>Another</a></li>
        <li><a>And another</a></li>
        <li>Some normal text</li>
        <li>Some more..</li>
        <li>And some more</li>
      </ul>
    </div>
    <span onmousedown="set_linkcolor( 'blue' )" 
         onmouseup="set_linkcolor( 'red' )" 
         style="border:solid 1px black;">
      Click me!
    </span>
  </body>
</html>

Last edited by MattEvans : Feb 27th, 2008 at 2:59 am.

If it only works in Internet Explorer; it doesn't work.