JavaScript - .animate Question/help

<script type="text/javascript">
$(document).ready(function(){	
    $('#menu').mouseover(function(){
      
      $(this).stop().animate({"right": 20 }, 400);
    }).mouseout(function(){ 
      $(this).stop().animate({"right": 0 }, 400);
    });;
});
</script> 

<div id="menu" style="
	width:90px;height:24px;
    font: #C12026;
    text-align:right;
    padding-right:10px;
    padding-top: 5px;">

<a href="#top" class="scroll">Home</a></div>
<br />
<div id="menu" style="
	width:90px;height:24px;
    font: #C12026;
    text-align:right;
    padding-right:10px;
    padding-top: 5px;">
    
    <a href="#who" class="scroll">Who We Are</a>
    </div>
    <br />
<div id="menu" style="
	width:90px;height:24px;
    font: #C12026;
    text-align:right;
    padding-right:10px;
    padding-top: 5px;">
    
    <a href="#what" class="scroll">What we do</a>
    </div>
    <br />
<div id="menu" style="
	width:90px;height:24px;
    font: #C12026;
    text-align:right;
    padding-right:10px;
    padding-top: 5px;">
    
    <a href="#contact" class="scroll">Contact Us</a>
</div>

#menu {
	width:125px;
	height:24px;
    background:#C00;
    font: #C00;
}

#menu a {
color: #C00;

}

#menu a:visited {
color: #C00;
}

#menu a:hover {
color: #FFF;
}

function animateIt(o) {
    if ( o.from < o.to ) {
        var y = ( o.type == 'opacity' ) ? 100 : 1;
        o.x = (o.positive) ? o.x + this.gap/y : o.x - this.gap/y;
        if ( o.type == 'opacity' ) {
            this.theObj.style.filter = "alpha(opacity=" + (o.x * 100) + ")";
            this.theObj.style.opacity = o.x;
        } else {
            this.theObj.style[o.type] = o.x + 'px';
        }
        (o.positive) ? o.from += this.gap/y : o.to -= this.gap/y;
    } else {
        this.stopIt();
    }   
}

    var svgNS = "http://www.w3.org/2000/svg";
    var xlinkNS = "http://www.w3.org/1999/xlink";
    var animateDur = "1s";

    function swap(a,b) {
    //this section handles moving the actual elements of the array
    //rectArray is an array of integer values that represent the height of the rectangles
      var temp = rectArray[a];;
      rectArray[a]=rectArray[b];
      rectArray[b]=temp;
    //this section is for the animation (will probably be its own function
    //for the final version
      //get the elements
      var aRect = document.getElementById("rect_" + a);
      var bRect = document.getElementById("rect_" + b);
      //get the element coordinates, bY isn't needed, as it
      //is the same as bX
      var aX = aRect.getAttributeNS(null,"x");
      var aY = aRect.getAttributeNS(null,"y");
      var bX = bRect.getAttributeNS(null,"x");
      //calculate the x distance from a to b and from b to a
      //to use in the bezier curve path
      var aToBx = bX - aX;
      var bToAx = aX - bX;
      //calculate the halfway point to use in the bezier curve
      var qA = Math.floor(aToBx/2);
      var qB = Math.floor(bToAx/2);
      //create the path strings:
	//should be M startX startY q midpointX midpointY endX endY
	//notice that endX and endY are with respect to the startX and startY
      var pathAtoB = "M" + aX + " " + aY + " q " + qA + " 30 "  + aToBx + " " + aY;
      var pathBtoA = "M" + bX + " " + bY + " q " + qB + " 30 "  + bToAx + " " + aY;
      //create the animation element for rectangle A
      animateA = document.createElementNS(svgNS, "animateMotion");
      animateA.setAttributeNS(null,"path",pathAtoB);
      animateA.setAttributeNS(null,"dur",animateDur);
      //append it to the rectangle
      aRect.appendChild(animateA);
      //create the animation element for rectangle B
      animateB = document.createElementNS(svgNS, "animateMotion");
      animateB.setAttributeNS(null,"path",pathBtoA);
      animateB.setAttributeNS(null,"dur",animateDur);
      //append it to the rectangle
      bRect.appendChild(animateB);
      //change the id's of the rectangles to reflect their new
      //positions
      aRect.setAttributeNS(null,"id","rect_" + b);
      bRect.setAttributeNS(null,"id","rect_" + a);
    }

<script language=javascript type='text/javascript'>
function showdiv() {
if (document.getElementById) { // DOM3 = IE5, NS6
document.getElementById('comments').style.visibility = 'visible';
}
else {
if (document.layers) { // Netscape 4
document.hideShow.visibility = 'visible';
}
else { // IE 4
document.all.hideShow.style.visibility = 'visible';
}
}
}

function hidediv() {
if (document.getElementById) { // DOM3 = IE5, NS6
document.getElementById('comments').style.visibility = 'hidden';
}
else {
if (document.layers) { // Netscape 4
document.hideShow.visibility = 'hidden';
}
else { // IE 4
document.all.hideShow.style.visibility = 'hidden';
}
}
}

border: solid 1px rgba(242, 112, 17, .0);

$('.item li img').animate({'opacity' : 1}).hover(function() {
					$(this).animate({'borderOpacity' : 1});
				}, function() {
					$(this).animate({'opacity' : 1});
				});