// Here are the initial values for our animation.
var unit = Math.round( screen.width / 8 );
var x = 0, y = 0, w=unit, h=unit; // Window position and size
var dx = 10, dy = 0; // Window velocity
var interval = 20; // Milliseconds between updates
// Create the window that we're going to move around.
// The javascript: URL is simply a way to display a short document.
// The final argument specifies the window size.
function play(){
//windows X
//1
winX1 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
// Set the initial position of the window.
winX1.moveTo(x,y);
//2
winX2 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winX2.moveTo(x+180,y);
//3
winX3 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winX3.moveTo(x+360,y);
//4
winX4 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winX4.moveTo(x+540,y);
//5
winX5 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winX5.moveTo(x+720,y);
//6
winX6 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winX6.moveTo(x+900,y);
//7
winX7 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winX7.moveTo(x+1080,y);
//8
winX8 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winX8.moveTo(x+1260,y);
//windows Y
//1
winY1 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winY1.moveTo(x,y+180);
//2
winY2 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winY2.moveTo(x,y+360);
//3
winY3 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winY3.moveTo(x,y+540);
//4
winY4 = window.open('javascript:"<h1>hypertext remix!</h1>"', "",
"width=" + w + ",height=" + h +",location=no,menubar=no,scrollbars=no,status=no,toolbar=no");
winY4.moveTo(x,y+780);
}
// This function moves the window by (dx, dy) every interval ms.
// It bounces whenever the window reaches the edge of the screen.
var bounce = function() {
// If the user closed the window, stop the animation.
if (winY1.closed) {
clearInterval(intervalID);
return;
}
// Bounce if we have reached the right or left edge.
if ((x+dx > (screen.availWidth - w)) || (x+dx < 0)) dx = -dx;
// Bounce if we have reached the bottom or top edge.
if ((y+dy > (screen.availHeight - h)) || (y+dy < 0)) dy = -dy;
// Update the current position of the window.
x += dx;
y += dy;
// Finally, move the window to the new position.
winY1.moveTo(x,y+180);
winY2.moveTo(x,y+360);
winY3.moveTo(x,y+540);
winY4.moveTo(x,y+780);
}
// Use setInterval() to call the bounce() method every interval
// milliseconds. Store the return value so that we can stop the
// animation by passing it to clearInterval().
var intervalID = window.setInterval("bounce()", interval);