window.onscroll = moveOverlay;

  function moveOverlay(){
	  if( document.body.scrollTop < 1200 ) {
	  if( document.getElementById('overlay') ) {
		var position = document.body.scrollTop - 400;
	  	document.getElementById('overlay').style.top = position;
	}
	}
  }

 function openlightbox(divId){
     if( !document.getElementById('overlay') ){
         createoverlay( divId );
     }

  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }

  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    myWidth = window.innerWidth;
    myHeight = window.innerHeight;
  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    myWidth = document.documentElement.clientWidth;
    myHeight = document.documentElement.clientHeight;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    myWidth = document.body.clientWidth;
    myHeight = document.body.clientHeight;
  }
  
     document.getElementById('overlay').style.width = myWidth;
     document.getElementById('overlay').style.height = myHeight + 800;
     document.getElementById('overlay').style.top = document.body.scrollTop;
     document.getElementById('overlay').style.display='block';
     opacity('overlay', 0, 75, 751);

     var tophat = scrOfY + 75; 
     document.getElementById(divId).style.top = tophat + "px";
     document.getElementById(divId).style.display='block';
 }

 function closelightbox(divId){
     document.getElementById(divId).style.display='none';
     setTimeout("document.getElementById('overlay').style.display='none'", 750);
     opacity('overlay', 75, 0, 750);
 }

 function opacity(id, opacStart, opacEnd, millisec) {
     var speed = Math.round(millisec / 100);
     var timer = 0;

     if(opacStart > opacEnd) {
         for(i = opacStart; i >= opacEnd; i--) {
             setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
             timer++;
         }
     } else if(opacStart < opacEnd) {
         for(i = opacStart; i <= opacEnd; i++) {
             setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
             timer++;
         }
     }
 }

 function changeOpac(opacity, id) {
     var object = document.getElementById(id).style;
     object.opacity = (opacity / 100);
     object.MozOpacity = (opacity / 100);
     object.KhtmlOpacity = (opacity / 100);
     object.filter = "alpha(opacity=" + opacity + ")";
 }

 function createoverlay(divId){
     var newdiv = document.createElement('div');
     newdiv.setAttribute('id', 'overlay');
     newdiv.setAttribute('onClick', "javascript:closelightbox('" + divId + "');");
     newdiv.style.MozOpacity = '0.0';
     newdiv.style.filter = 'alpha(opacity=0)'
     newdiv.style.display = 'none';
     newdiv.style.zIndex = '1000';
     newdiv.style.backgroundColor = '#000000';
     newdiv.style.height = '100%';
     newdiv.style.overflow = 'hidden';
     newdiv.style.position = 'absolute';
     newdiv.style.left = '0px';
     newdiv.style.top = '0px';
     newdiv.style.width = '100%';
     document.body.appendChild(newdiv);
 }