앞의 예제에서 처럼 각 레이어를 이동시키는 함수를 만들지 않고 이동할 레이어에 관한 정보를 배열에 모아놓고 이들 배열을 다루므로 코드를 간단히 할 수 있고 다루기도 편합니다. 여기서는 4개의 레이어를 사용하여 각 레이어를 연속적으로 이동시킵니다.

이들 4개의 레이어를 다루기 위해서 하나의 배열을 선언하고 각각 지정합니다. 즉 필요한 인자를 각각 넣어주고 이들을 수정함으로 레이어들의 동작을 수정할 수 있습니다.

숫자는 실행할 순서를 지정합니다. 여기서는 숫자 1번이 가장먼저 실행을 합니다. 0을 지정할 수도 있습니다. 그래서, 이 숫자를 지정함으로 전체 레이어의 이동순서를 바꿀 수 있습니다. 아주 편리하죠. 위의 A, B, C, D도 마찬가지입니다. 지정해줄 인자를 바꾸어 줌으로 레이어의 이동속도, 순서, 최종 left 좌표를 지정할 수 있습니다. 이들을 잘 조합하면 레이어의 동작을 일정하게 하거나 random()으로 불규칙적으로도 사용할 수 있습니다.

이 코드를 사용한다면 이 숫자와 A,B,C,D 만 조정하면 됩니다.

moveLeft(1) 함수는 레이어 이동을 시작합니다.
그리고, 각 레이어가 최종 left까지 오면 이동을 멈추고 다음 레이어를 이동합니다.

#D1 { 
  position:absolute; top:0;    left:100; width:10; border-width:1; 
  border-style:solid; border-color:red; visibility:hidden;
}
#D2 { 
  position:absolute; top:100; left:500; width:10; border-width:1; 
  border-style:solid; border-color:red; visibility:hidden;
}
#D3 { 
  position:absolute; top:200; left:100; width:10; border-width:1; 
  border-style:solid; border-color:red; visibility:hidden; 
}
#D4 { 
  position:absolute; top:300; left:500; width:10; border-width:1; 
  border-style:solid; border-color:red; visibility:hidden;
}

<div id=D1><img src="../../images/img1.gif"></div>
<div id=D2><img src="../../images/img2.gif"></div>
<div id=D3><img src="../../images/img3.gif"></div>
<div id=D4><img src="../../images/img4.gif"></div>

function leftMoveSet(layer, time, moveBit, moveTo) { 
  //layer:이동할 레이어. time:이동시간. moveBit:한번 이동거리. moveTo:이동할 최종지점. 
  this.layer = layer
  this.moveTime = time
  this.moveBit = moveBit
  this.moveTo = moveTo 
}
function initMoveLeft() {

  if(n4) {
    leftLayer = new Array();
    leftLayer[3] = new leftMoveSet(document.D1, 1, 20, 500)
    leftLayer[2] = new leftMoveSet(document.D2, 1, 20, 100)
    leftLayer[1] = new leftMoveSet(document.D3, 1, 20, 500)
    leftLayer[4] = new leftMoveSet(document.D4, 1, 10, 0)
    moveLeft(1); 
  }
  else if(e4) {
    leftLayer = new Array();
    leftLayer[1] = new leftMoveSet(document.all.D1.style, 1, 10, 500)
    leftLayer[2] = new leftMoveSet(document.all.D2.style, 1, 10, 0)
    leftLayer[3] = new leftMoveSet(document.all.D3.style, 1, 4, 500)
    leftLayer[4] = new leftMoveSet(document.all.D4.style, 1, 10, 0)
    moveLeft(1); 
  }
}

function moveLeft(X) {
	
  if(n4) { 
    if( leftLayer[X].layer.left < leftLayer[X].moveTo - leftLayer[X].moveBit ) {
      leftLayer[X].layer.left += leftLayer[X].moveBit; 
      moveLeft_timer = setTimeout("clearTimeout(moveLeft_timer); moveLeft("+X+")", leftLayer[X].moveTime)
    }
    else if( leftLayer[X].layer.left < leftLayer[X].moveTo ) {
      while( leftLayer[X].layer.left > leftLayer[X].moveTo - leftLayer[X].moveBit ) 
	leftLayer[X].moveBit--
      leftLayer[X].layer.left += leftLayer[X].moveBit
      moveLeft_timer = setTimeout("clearTimeout(moveLeft_timer); moveLeft("+X+")", leftLayer[X].moveTime)	
    }

    else if( leftLayer[X].layer.left > leftLayer[X].moveTo + leftLayer[X].moveBit ) { 
      leftLayer[X].layer.left -= leftLayer[X].moveBit; 
      moveLeft_timer = setTimeout("clearTimeout(moveLeft_timer); moveLeft("+X+")", leftLayer[X].moveTime)
    }
    else if( leftLayer[X].layer.left > leftLayer[X].moveTo ) { 
      while( leftLayer[X].layer.left < leftLayer[X].moveTo + leftLayer[X].moveBit ) 
	leftLayer[X].moveBit--
      leftLayer[X].layer.left -= leftLayer[X].moveBit
      moveLeft_timer = setTimeout("clearTimeout(moveLeft_timer); moveLeft("+X+")", leftLayer[X].moveTime)
    }

    else { 
      X++;
      if( X < leftLayer.length ) moveLeft(X) 
    }
  }
  else if(e4) {
    if( leftLayer[X].layer.pixelLeft < leftLayer[X].moveTo - leftLayer[X].moveBit ) {
      leftLayer[X].layer.pixelLeft += leftLayer[X].moveBit; 
	moveLeft_timer = setTimeout("clearTimeout(moveLeft_timer); moveLeft("+X+")", leftLayer[X].moveTime)
    }
    else if( leftLayer[X].layer.pixelLeft < leftLayer[X].moveTo ) {
      while( leftLayer[X].layer.pixelLeft > leftLayer[X].moveTo - leftLayer[X].moveBit ) 
        leftLayer[X].moveBit--
      leftLayer[X].layer.pixelLeft += leftLayer[X].moveBit
      moveLeft_timer = setTimeout("clearTimeout(moveLeft_timer); moveLeft("+X+")", leftLayer[X].moveTime)	
    }

    else if( leftLayer[X].layer.pixelLeft > leftLayer[X].moveTo + leftLayer[X].moveBit ) { 
      leftLayer[X].layer.pixelLeft -= leftLayer[X].moveBit; 
      moveLeft_timer = setTimeout("clearTimeout(moveLeft_timer); moveLeft("+X+")", leftLayer[X].moveTime)
    }
    else if( leftLayer[X].layer.pixelLeft > leftLayer[X].moveTo ) { 
      while( leftLayer[X].layer.pixelLeft < leftLayer[X].moveTo + leftLayer[X].moveBit ) 
        leftLayer[X].moveBit--
      leftLayer[X].layer.pixelLeft -= leftLayer[X].moveBit
      moveLeft_timer = setTimeout("clearTimeout(moveLeft_timer); moveLeft("+X+")", leftLayer[X].moveTime)
    }

    else { 
      X++;
      if( X < leftLayer.length ) moveLeft(X) 
    }
  }
}