//var test = new ScrollImg('imgBox');
ScrollImg = function(imgBoxId){
 this.imgBoxId = imgBoxId;
 this.table = this.createTable();
 this.imgBoxP = this.$(this.imgBoxId).parentNode;
 this.setOnclick();
 this.$(this.imgBoxId).appendChild(this.table)
}

ScrollImg.prototype = {
 $:function(objId){ 
  return document.getElementById(objId);
 },
 $$:function(n){ 
  return document.createElement(n);
 },
 createTable:function(){
  var table = this.$$('table');
  var tr = this.$$('tr'); 
  for(var k=0; k<3; k++) tr.appendChild(this.$$('td'));
  var tbody = this.$$('tbody');
  tbody.appendChild(tr);
  table.appendChild(tbody);
  return table;
 },
 setSpan:function(){
  var links = this.$(this.imgBoxId).getElementsByTagName('a');
  for(var k=0; k<links.length; k++){
   var span = this.$$('span');
   span.appendChild(document.createTextNode(links[k].getElementsByTagName('img')[0].alt));
   links[k].appendChild(span);
  }
  return;
 },
 setOnclick:function (){
  var imgArray = ['left', ,'right'];
  var tds = this.table.getElementsByTagName('td');
  for(var k=0; k<tds.length; k++){
   tds[k].setAttribute('vAlign', 'center');
   if(k == 1){
    var div = this.$$('div');
    var ul = this.$(this.imgBoxId).getElementsByTagName('ul')[0];
    div.appendChild(ul);
    tds[k].appendChild(div);
    continue
   }
   
   var img = this.$$('img');
   img.setAttribute('src', 'images/'+imgArray[k]+'.jpg');
   img.setAttribute('alt', imgArray[k]);
   img.style.cursor = 'pointer';
   img.onclick = function (){
    var imgBox = this.parentNode.parentNode.getElementsByTagName('div')[0];
    var ns = imgBox.scrollLeft;
    var tkey = 160;
    if(this.alt == 'left'){
     var left = setInterval(function(){ 
      imgBox.scrollLeft = imgBox.scrollLeft - (tkey * 0.1);
      tkey = tkey * 0.9;
      if(tkey < 2) clearInterval(left); 
     },50); 
    } else {
     var right = setInterval(function (){
      imgBox.scrollLeft = imgBox.scrollLeft + (tkey * 0.1);
      tkey = tkey * 0.9;
      if(tkey < 2) clearInterval(right); 
     },50);
    }
    return;
   }
   tds[k].appendChild(img);   
  }
  return;
 }
}