Husky Heaven 6

  <script type="text/javascript" src="Tween.js"></script>
  <script type="text/javascript" src="OpacityTween.js"></script> 
  <script type="text/javascript">
  
  function doSequence()
  {
  	moveSmiley1();
	setTimeout('two()', 5000);
	setTimeout('three()',10000);
 
  } 
  
  function two()
  {
   var i = document.getElementById("one");
   i.style.display = "none";
   var j = document.getElementById("two");
   j.style.display = "block";
   moveSmiley2();
  }
  
  function three()
  {
   var i = document.getElementById("two");
   i.style.display = "none";
   var j = document.getElementById("three");
   j.style.display = "block";
   moveSmiley3();
  }  
  
  function moveSmiley1()
  {
  	var i = document.getElementById("smiley1");
	var t = new OpacityTween(i, Tween.regularEaseIn, 0, 100, 3);
	t.start();    
  }
  
  function moveSmiley2()
  {
  	var i = document.getElementById("smiley2");
	var t = new OpacityTween(i, Tween.regularEaseIn, 0, 100, 3);
	t.start();    
  }
  
  function moveSmiley3()
  {
 	var i = document.getElementById("smiley3");
	var t = new OpacityTween(i, Tween.regularEaseIn, 0, 100, 3);
	t.start();    
  }
  
  
  </script>
  
</head>
<body onLoad="doSequence()">

<div id="one" style="height: 300px; width: 600px; background-color: red;display: block">
	<img src="smileyFace.jpg" id="smiley1" style="filter:Alpha(opacity=0);-moz-opacity:.0">
	
</div>
<div id="two" style="height: 300px; width: 600px; background-color: yellow;display: none">
	<img src="smileyFace.jpg" id="smiley2" style="filter:Alpha(opacity=0);-moz-opacity:.0"> 
	
</div>
<div id="three" style="height: 300px; width: 600px; background-color: blue;display: none">
	<img src="smileyFace.jpg" id="smiley3" style="filter:Alpha(opacity=0);-moz-opacity:.0"> 
	
</div>