var scroller = {
  init:   function() {
    scroller.docH = document.getElementById("content").offsetHeight;
    scroller.contH = document.getElementById("container").offsetHeight;
    scroller.scrollAreaH = document.getElementById("scrollArea").offsetHeight;
    scroller.scrollH = 30;
    document.getElementById("scroller").style.height = Math.round(scroller.scrollH) + "px";
    scroller.scrollDist = Math.round(scroller.scrollAreaH-scroller.scrollH);
    Drag.init(document.getElementById("scroller"),null,0,0,0,scroller.scrollDist);
    document.getElementById("scroller").onDrag = function (x,y) {
      var scrollY = parseInt(document.getElementById("scroller").style.top);
      var docY = 0 - (scrollY * (scroller.docH - scroller.contH) / scroller.scrollDist);
      document.getElementById("content").style.top = docY + "px";
	  
	  	if(document.getElementById("scroller").offsetTop == 0){
			document.getElementById('scrollerbg').src ='images/scroll2.png'
		}
		if(document.getElementById("scroller").offsetTop == 390){
			document.getElementById('scrollerbg').src = 'images/scroll3.png'
		}
		if(document.getElementById("scroller").offsetTop != 0 & document.getElementById("scroller").offsetTop != 390)
		  {document.getElementById('scrollerbg').src = 'images/scroll1.png'}
    }

  }
}

onload = scroller.init;