JavaScript - Auto Animate On Page Load

alreadyloading = false;
nextpage = 2;
 
$(window).scroll(function() {
    if ($('body').height() <= ($(window).height() + $(window).scrollTop())) {
        if (alreadyloading == false) {
            var url = "page"+nextpage+".html";
            alreadyloading = true;
            $.post(url, function(data) {
                $('#projectscontainer').children().last().after(data);
                alreadyloading = false;
                nextpage++;
            });
        }
    }
});

$(document).ready(function () { 
  // id  is the ID for the DIV you want to display it as modal window 
  launchWindow( dialog );  
  
		//Get the screen height and width
		var maskHeight = $(document).height();
		var maskWidth = $(window).width();
	
		//Set heigth and width to mask to fill up the whole screen
		$('#mask').css({'width':maskWidth,'height':maskHeight});
		
		//transition effect		
		$('#mask').fadeIn(1000);	
		$('#mask').fadeTo("slow",0.8);	
	
		//Get the window height and width
		var winH = $(window).height();
		var winW = $(window).width();
              
		//Set the popup window to center
		$( dialog ).css('top',  winH/2-$( dialog ).height()/2);
		$( dialog ).css('left', winW/2-$( dialog ).width()/2);
	
		//transition effect
		$( dialog ).fadeIn(2000); 
	
	
	
	//if close button is clicked
	$('.window .close').click(function (e) {
		//Cancel the link behavior
		e.preventDefault();
		
		$('#mask').hide();
		$('.window').hide();
	});		
	
	//if mask is clicked
	$('#mask').click(function () {
		$(this).hide();
		$('.window').hide();
	});				
});

<script type="text/javascript">
// <![CDATA[
var height=9; // height of the effect in rows - must be an odd number
var speed=66;  // lower is faster
var reveal=99; // between 0 and 100
               // the higher, the faster the word is 'decoded'
var repeat=10;  // if '0' the script does not repeat
               // if set to a number this is the delay until the script repeats
var alink="http://www.noma.nu"; // place to link to
                                      // set to alink="" if not needed

/***************************\
* The Matrix JavaScripted.. *
*(c) 2003-6 mf2fm web-design*
*  http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
\***************************/
var timer, table, x, y, columns, ma_txt, ma_cho;
reveal/=100;
var m_coch=new Array();
var m_copo=new Array();
window.onload=function()  This is part im having troubles with. If i do as your toturial tells me i should put Function() down in the body onload command. But it wont work.  { if (document.getElementById) {
  var matrix, tbody, tr, td;
  matrix=document.getElementById("matrix");
  ma_txt=matrix.firstChild.nodeValue;
  ma_txt=" "+ma_txt+" ";
  columns=ma_txt.length;
  while (matrix.childNodes.length) matrix.removeChild(matrix.childNodes[0]);
  table=document.createElement("table");
  table.cellSpacing=0;
  table.style.margin="auto";
  table.style.width="auto";
  table.style.border="none";
  tbody=document.createElement("tbody");
  for (x=0; x<height; x++) {
    tr=document.createElement("tr");
    for (y=0; y<columns; y++) {
      td=document.createElement("td");
      td.className="matrix";
      td.appendChild(document.createTextNode(String.fromCharCode(160)));
      tr.appendChild(td);
    }
    tbody.appendChild(tr);
  }
  table.appendChild(tbody);
  matrix.appendChild(table);
  ma_cho=ma_txt;
  for (x=0; x<columns; x++) {
    m_copo[x]=0;
    ma_cho+=String.fromCharCode(32+Math.floor(Math.random()*94));
  }
  x=0;
  timer=setInterval("mytricks()", speed);
}}

function mytricks() {
  var mtmp, mrow;
  var z=x;
  x=0;
  for (y=0; y<columns; y++) {
    x=x+(m_copo[y]==100);
    mrow=m_copo[y]%100;
    if (mrow && m_copo[y]<100) {
      if (mrow<height+1) {
		mtmp=table.rows[mrow-1].cells[y];
        mtmp.firstChild.nodeValue=m_coch[y];
        mtmp.style.color="#33ff66";
        mtmp.style.fontWeight="bold";
      }
      if (mrow>1 && mrow<height+2) {
		mtmp=table.rows[mrow-2].cells[y];
        mtmp.style.fontWeight="normal";
        mtmp.style.color="#00ff00";
      }
      if (mrow>2) table.rows[mrow-3].cells[y].style.color="#009900";
      if (mrow<Math.floor(height/2)+1) m_copo[y]++;
      else if (mrow==Math.floor(height/2)+1 && m_coch[y]==ma_txt.charAt(y)) zoomer(y);
      else if (mrow<height+2) m_copo[y]++;
      else if (m_copo[y]<100) m_copo[y]=0;
    }
    else if (Math.random()>0.9 && m_copo[y]<100) {
      if (reveal>Math.random() && (z+1)/columns>Math.random()) m_coch[y]=ma_cho.charAt(y);
      else m_coch[y]=ma_cho.charAt(Math.floor(Math.random()*ma_cho.length));
      m_copo[y]++;
    }
  }
  if (x==columns) {
    if (repeat) {
      ma_cho=ma_txt;
      for (x=0; x<columns; x++) {
        m_copo[x]=0;
        ma_cho+=String.fromCharCode(32+Math.floor(Math.random()*94));
      }
    }
    else clearInterval(timer);
  }
}

function zoomer(ycol) {
  var mtmp, mtem, ytmp;
  if (m_copo[ycol]==Math.floor(height/2)+1) {
    for (ytmp=0; ytmp<height; ytmp++) {
	  mtmp=table.rows[ytmp].cells[ycol];
      mtmp.firstChild.nodeValue=m_coch[ycol];
      mtmp.style.color="#33ff66";
      mtmp.style.fontWeight="bold";
      if (alink) {
        mtmp.style.cursor="pointer";
        mtmp.onclick=function() {window.location.href=alink};
      }
    }
    mtmp=ma_cho.indexOf(ma_txt.charAt(ycol));
    m_copo[ycol]+=199;
    setTimeout("zoomer("+ycol+")", speed);
  }
  else if (m_copo[ycol]>200) {
	mtmp=table.rows[m_copo[ycol]-201].cells[ycol];
	mtem=table.rows[200+height-m_copo[ycol]].cells[ycol];
    m_copo[ycol]-=1;
    mtmp.style.fontWeight="normal";
    mtem.style.fontWeight="normal";
    setTimeout("zoomer("+ycol+")", speed);
  }
  else if (m_copo[ycol]==200) m_copo[ycol]=100+Math.floor(height/2);
  if (m_copo[ycol]>100 && m_copo[ycol]<200) {
	mtmp=table.rows[m_copo[ycol]-101].cells[ycol];
    mtmp.firstChild.nodeValue=String.fromCharCode(160);
	mtem=table.rows[100+height-m_copo[ycol]].cells[ycol];
    mtem.firstChild.nodeValue=String.fromCharCode(160);
    m_copo[ycol]-=1;
    setTimeout("zoomer("+ycol+")", speed);
  }
}
// ]]>
</script>

<script type="text/javascript"> 
function showClock()
{
 // create a new Date() object
 var currentTime=new Date();
 var hours=currentTime.getHours();
 var minutes=currentTime.getMinutes();
 var seconds=currentTime.getSeconds();
 var area=currentTime.getTimezoneOffset();
 area=area/60;
 var clock=hours;
 
 // add a zero in front of numbers<10
  if (minutes<10){
   minutes="0" + minutes;
  }
  if (seconds<10){
   seconds="0" + seconds;
  }
 document.getElementById('clock').innerHTML="<table><tr><td width=80 align=center>"+clock+":"+minutes+":"+seconds+"</td>"
 +""
 +"";
 t=setTimeout('showClock()',500);
 // setTimeout calls showClock() function every 500 miliseconds, that means 0.5 seconds
}
</script>

<body onload="showclock()">   this is where the clock load. It works fine. how do i get the other script to load with this. 

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Christmas Greets!</title>
<script type="text/javascript">
<!--
function switchMenu(obj) {
	var el = document.getElementById(obj);
	if ( el.style.display != "none" ) {
		el.style.display = 'none';
	}
	else {
		el.style.display = '';
	}
}
//-->
</script>
</head>

<body>
<div id="wrapper">
<img src="somepicture.png"
	<p><a onclick="switchMenu('myvar');" title="View Greeting"><button>Preview</button></a></p>
	<div id="myvar">
	<video width="240" height="160" controls="controls">
  	<source src="EatResponsibly.mp4" type="video/mp4" />
  	<source src="EatResponsibly.ogv" type="video/ogv" />
  	<source src="EatResponsibly.webm" type="video/webm" />
  	You Browser Does not Support This Video.
 	Please Update Your Browser.
	</video>
</div>
</div>
</body>
</html>

onload="document.getElementById("hidepage").style.visibility="hidden";"

    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);
    }

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
	$(function() { 
		$("#nav li > a").hover(function() {
			$(this).stop().animate({paddingTop: "100px"}, 100);
		}, 
		function() {
			$(this).stop().animate({paddingTop: "10px"}, 200);		
		});
	});
</script>

<style type="text/css">	
	#nav
	{
		position: absolute;
		top: 0;
		left: 60px;
		padding: 0;
		margin: 0;
		list-style: none;
	}
	
	#nav li
	{
		display: inline;
	}
	
	#nav li a
	{
		float: left;
		display: block;
		color: #555;
		text-decoration: none;
		padding: 10px 30px;
		background-color: #d1d1d1;
		border-top: none;
	}
</style>

</head>

<body>

<div id="wrap">

    <ul id="nav">
        <li><a href="">test1</a></li>
        <li><a href="">test2</a></li>
        <li><a href="">test3</a></li>
        <li><a href="">test4</a></li>

    </ul>
</div>
</body>
</html>

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();
    }   
}