var xPos = 300;
var yPos = 200; 
var step = 1;
var delay = 30; 
var height = 0;
var Hoffset = 0;
var Woffset = 0;
var yon = 0;
var xon = 0;
var pause = true;
var interval;
var interval2;

img1.style.top = yPos;

function changeImg(){
	if (img1.style.display=='block'){
		img1.style.display='none';
		img2.style.display='block';
	}else{
		img1.style.display='block';
		img2.style.display='none';
	}
	
}

function changePos() {
	width = document.body.clientWidth;
	height = document.body.clientHeight;
	Hoffset = img1.offsetHeight;
	Woffset = img1.offsetWidth;
	img1.style.left = xPos + document.body.scrollLeft;
	img1.style.top = yPos + document.body.scrollTop;
	img2.style.left =img1.style.left
	img2.style.top = img1.style.top
	if (yon) {
		yPos = yPos + step;
	}
	else {
		yPos = yPos - step;
	}
	if (yPos < 0) {
		yon = 1;yPos = 0;
	}
	if (yPos >= (height - Hoffset))	{
		yon = 0;yPos = (height - Hoffset);
	}
	if (xon) {
		xPos = xPos + step;
	}
	else {
		xPos = xPos - step;
	}
	if (xPos < 0){
		xon = 1;xPos = 0;
	}
	if (xPos >= (width - Woffset)){
		xon = 0;xPos = (width - Woffset);
	}	
}

function start(){	
	interval2 = setInterval('changeImg()', 3000);	
	interval = setInterval('changePos()', delay);
	
}

function pause_resume() {
	if(pause){
		clearInterval(interval);
		pause = false;}
	else{
		interval = setInterval('changePos()',delay);
		pause = true; 
	}
}


img2.style.display='none';
start();

img1.onmouseover=function() {
	img1.style.display='block';
	clearInterval(interval);
	clearInterval(interval2);
} 
img1.onmouseout=function(){start();} 
img2.onmouseover=function() {
	img2.style.display='block';
	clearInterval(interval);
	clearInterval(interval2);
} 
img2.onmouseout=function(){start();}