function positionMessage() {
  if (!document.getElementById) return false;
  if (!document.getElementById("messageA")) return false;
  var elemA = document.getElementById("messageA");
  elemA.style.position = "absolute";
  var xPosFinalA=427;//final x-position of message A
  var xPosFinalB=467;///final x-position of message B
   var yPosFinal=85;// vertical position of both messages, after message has been put together on same level
   var incrX=1;  //incremental step along x-axis. Must be integer
  var incrY=0.125;  //incremental step along y-axis - if less than 1, must divide into 1 exactly
  var ns=80;   //number of incremental steps, must have factor = (2/incrY).
  var moveX=incrX*ns;  // equals the movement of each message parallel to x-axis
  var moveY=incrY*ns;  // equals vertical gap between messages and final position
  
  var xPosA=xPosFinalA - moveX; //x-pos at start of message1 
  var xPosB=xPosFinalB- (-moveX); //x-pos at start of message2, use - - instead of +, to ensure we have numbers
  var yPosA=yPosFinal -( moveY);//+ or - sign here, but use - - for +
  var yPosB=yPosFinal - (-moveY); //+ or - sign here
  timeInt=10;
  elemA.style.left = xPosA +"px"; // initial x-pos of message1 
  elemA.style.top = Math.round(yPosA) +"px"; // initial y-pos of message1 
 
  
  if (!document.getElementById("messageB")) return false;
  var elemB = document.getElementById("messageB");
  elemB.style.position = "absolute";
  elemB.style.left = xPosB +"px"; // initial x-pos of messageB
  elemB.style.top = Math.round(yPosB)+"px";// initial y-pos of messageB
  moveElements("messageA",xPosA,xPosFinalA,yPosA,"messageB",xPosB,xPosFinalB,yPosB,yPosFinal,timeInt,incrX,incrY,ns); 
} //eof positionMessage


function moveElements(elementAid,startXa,finalXa,startYa,elementBid,startXb,finalXb,startYb,finalY,timeInt,incrX,incrY,ns){
if (!document.getElementById) return false;
  if (!document.getElementById(elementAid)) return false;
if (!document.getElementById(elementBid)) return false;
var elemA=document.getElementById(elementAid);
var elemB=document.getElementById(elementBid);

//alert("startXa= " + startXa +", startYb = "  +startYb);
ns--;
if(ns<0){return true;}
 if (-startXa > -finalXa) {//we need to use -ve signs here to ensure values are numbers and not strings - needed if value goes below 100
    startXa = startXa -(- incrX);//ensure startXa stays a number by using subtraction 
  }
if (-startXa < -finalXa) {
    startXa = startXa - incrX;
  }
  if (-startYa > -finalY) {
    startYa = startYa - ( - incrY);
  }
if (-startYa< -finalY) {
    startYa = startYa - incrY;
  }
 if (-startXb > -finalXb) {
    startXb = startXb - (- incrX);//ensure startXb is a number
  }
if (-startXb < -finalXb) {
    startXb = startXb - incrX;
  }
  if (-startYb > -finalY) { 
    startYb = startYb - (-(incrY));
  }
if (-startYb< -finalY) {
    startYb = startYb - incrY;
  }
elemA.style.left = startXa + "px";
  elemA.style.top = Math.round(startYa) + "px";
elemB.style.left = startXb+ "px";
  elemB.style.top = Math.round(startYb) + "px";
// alert("elementAid = " + elementAid + ", startXa = " + startXa + ", finalXa = " + finalXa +", startYa = " +startYa +", finalY = " + finalY+ ", incrX = " + incrX + ", incrY = " + incrY+", ns = " + ns);

// alert("elementBid = " + elementBid + ", startXb = " + startXb + ", finalXb = " + finalXb +", startYb = " + startYb +", finalY = " + finalY+ ", incrX = " + incrX + ", incrY = " + incrY+", ns = " + ns);


//var repeat ="moveElements(" + elementAid + "," + startXa + "," + finalXa + "," + startYa + "," + elementBid + "," + startXb + "," + finalXb + ","+ startYb + "," + finalY + "," + timeInt + "," + incrX + "," + incrY + ", " + ns +")";
  var repeat="moveElements('"+elementAid+"','"+startXa+"','"+finalXa+"','"+startYa+"','"+elementBid+"','"+startXb+"','"+finalXb+"','"+startYb+"','"+finalY+"','"+timeInt          +"','"+incrX+"','"+ incrY+"','"+ns +"')";
  
movement = setTimeout(repeat,timeInt);
} //eof moveElements




addLoadEvent(positionMessage);
addLoadEvent(moveElements);