Valid HTML 4.01 Transitional Marquee

[hinksta]

I'm trying to make a Valid HTML 4.01 Transitional Marquee in phpnuke.

I have found a JavaScript that does the job, you can see it at ontheball.info it's the scrolling news on the left.

Things I would like to change but don't know how

1, Have the text stop and start using onMouseover / onMouseout

2, at present the initial start/stop/restart of the text is set by numbers. I would like this to be automatic.

3, This JavaScript only seems to let me run one marquee at a time, I would like it to run two.

Here’s the script

PHP Code:

function makeItMove(containerId,userActionId,textItemId,i)
{
// Values used by the script.
// BEWARE : YOU WILL HAVE TO MODIFIE THESE VALUES IN THE HTML CODE AS WELL, SETTING THEM TO THEIR NUMERIC VALUES!
var startValue=-222;// The value the movement will start. Must be big enough to let some white space.
var endValue=1400; // the value the movement will end. Must be big enough to let the whoile text disappear
var stopValue=1450; // Must be greater than endValue;
//
var containerPositionFromTop=0;
var containerPositionFromLeft=0;
var containerWidth=138;
var containerHeight=220;
//

if (document.getElementById)
    {
    
    if(!document.getElementById('userAction'))
        {
        //alert("No action");
        
        }
    else
        {
        document.getElementById(userActionId).style.visibility="visible";
        //document.getElementById(userActionId).style.backgroundColor="rgb(257,205,217)";
        document.getElementById(userActionId).style.display="block";
        //document.getElementById(userActionId).style.float="left";
        document.getElementById(userActionId).style.zIndex="15";
        document.getElementById(userActionId).style.position="absolute";
        document.getElementById(userActionId).style.top="0px";
        document.getElementById(userActionId).style.left="0px";
        document.getElementById(userActionId).style.width="138";
        document.getElementById(userActionId).style.height="auto";
        }
    document.getElementById(containerId).style.zIndex="11";
    document.getElementById(containerId).style.position="relative";
    document.getElementById(containerId).style.top=containerPositionFromTop+"px";
    document.getElementById(containerId).style.left=containerPositionFromLeft+"px";
    document.getElementById(containerId).style.width=containerWidth+"px";
    document.getElementById(containerId).style.height=containerHeight+"px";    
    document.getElementById(containerId).style.overflow="hidden";
    document.getElementById(textItemId).style.zIndex="11";
    document.getElementById(textItemId).style.position="absolute";
    document.getElementById(textItemId).style.top=-i+"px";
    document.getElementById(textItemId).style.left=0+"px";
    
    document.getElementById(textItemId).style.zIndex="11";
    }
if(i<endValue)
    {
    i++;
    //alert("makeItMove("+textItemId+","+i+")");
    timer=setTimeout("makeItMove('"+containerId+"','"+userActionId+"','"+textItemId+"',"+i+")",50);
    }
    else
    if(i==endValue)
        {
        i=startValue;
        timer=setTimeout("makeItMove('"+containerId+"','"+userActionId+"','"+textItemId+"',"+i+")",50);
        }
     else
        {
        clearTimeout(timer);
        document.getElementById(textItemId).style.zIndex="11";
        document.getElementById(textItemId).style.position="absolute";
        document.getElementById(textItemId).style.top=17+"px";
        document.getElementById(textItemId).style.left=0+"px";
        document.getElementById(containerId).style.overflow="scroll";
        
                }
}


Hope you can help.