Return to Revisions

Without re-writing all your code I do have a few suggestions for you:

• Don't use inline javascript (onMouseeOut, onMouseOver) always use event listeners (I'll show you how the code example below)
• Use classes instead of inline styles
  • this means replace the style=xxx with a css classname (again i'll have an example in the code below)
• A lot of your code can be condensed into small reuseable functions since a lot of it is repetitive.

Since you are new to JavaScript I'll avoid some of of the intermediate patterns that I think may apply here such as wrapping this entire functionality in an instantly invoked function expression (IIFE) but you really should read this article by Ben Alman http://benalman.com/news/2010/11/immediately-invoked-function-expression/

So lets look at how it can be improved with some psudo code. First Lets create one wrapper function that will encapsulate all your functionality. First set some function variables to your links and radios. Then we attach events for most browsers and older versions of IE, then we create two generic functions to handle your mouseenter and mouseleave. These functions will handle the duplicated logic of checking

function overOut(){
 //these variables will be accessable by all the inner functions so we only declare them once
  var fbLinks = document.links.fb,
      twLinks = document.links.tw
      fbLink = document.getElementById('fb_link'),
      twLink = document.getElementById('tw_link');
  
  //check for standard event listener    
  if(fbLink.addEventListener){
    //here i'm assuming that fblinks are the links you want to highlight
    fbLink.addEventListener("mouseover",radioOverFunction(this,fbLinks));
  }
  //ie events
  else if(fbLink.attachEvent){
    //here i'm assuming that fblinks are the links you want to highlight
    fbLink.attachEvent("mouseover",radioOverFunction(this,fbLinks));
  }

  /***************************************************
  *  repeat the above code but for mouseout events   *
  ***************************************************/
    
  var radioOverFunction = function(radio,target){
      //in here you would set check the radio and set the classname on the target
      target.className = 'mouseOverClassName';
  };

  var radioLeaveFunction = function(radio,target){
      //in here you would set check the radio and set the classname on the target
      target.className = 'standardClassName';
  }


}