// Put the below in your page or iframe //
// <div id="mainNews" onmouseover="kill(this.id);" onmouseout="animate(this.id);"><script>int('mainNews');</script>CONTENT GOES HERE</div>//



// THIS SETS THE POSITION TO BEGIN WITH //
// 'mainNews' is the DIV to be animated, so change to the appropriate name// 

function int(){
document.getElementById('mainNews').style.top = 0 + 'px';
animate();
}

// WHERE IT ALL HAPPENS //
function animate(){
	
	h = parseInt(document.getElementById('mainNews').style.top); // just gets rid of the 'px' bit that is returned when getting the DIV's position //
	maxH = document.getElementById('mainNews').offsetHeight; // get the height of the DIV //
	maxy = maxH-maxH-maxH+50; // changes the max height to a negative value, the 50 is just a little adjustment so that it restarts just before it reaches it's max //


if(h >= maxy){ // basically, while the DIV's top position is greater than it's maximum height animate it upwards
		
		if(maxH >= 150) // if the height of the DIV is more than 150px (or more than the height of two items) move it 
			{	
			document.getElementById('mainNews').style.top =  parseInt(h)-1 + 'px'; // actually moves the DIV 1px up //
			}
		else // if the height of the DIV is smaller than 150 (ie. only has one item) see below//
		{
		document.getElementById('mainNews').style.top = 0 + 'px'; // only one item so don't scroll //
		}
		}
else// if it's reached it's maximum height so do below
{
document.getElementById('mainNews').style.top = 100 + 'px';	// reset it's position and start again
}
		
		
		// THE TIMER //
		run = setTimeout("animate()", 50);
}

// STOP THE BOX ANIMATING ON ROLL OVER //
function kill(){
clearTimeout(run);	
}
