Full version: jsB@nk » Browser » Window » Animated Frame
URL: https://www.javascriptbank.com/animated-frame.html
This JavaScript creates animated frame with 4 cells.
Full version: jsB@nk » Browser » Window » Animated Frame
URL: https://www.javascriptbank.com/animated-frame.html
<SCRIPT language=JavaScript1.1>// open a new windowvar n = window.open('', 'f', 'width=400,height=400');// dynamically create frames in that new window.// Note the use of the special about:blank URL to get empty framesn.document.write('<frameset rows="50%,50%" cols="50%,50%">');n.document.write('<frame name="f1" src="about:blank">');n.document.write('<frame name="f2" src="about:blank">');n.document.write('<frame name="f3" src="about:blank">');n.document.write('<frame name="f4" src="about:blank">');n.document.write('</frameset>');// An array of the colors we cycle through for the animationcolors = new Array("yellow","green","black","aqua","blue");// An array of the frames we cycle through (in this order) windows = new Array(n.f1, n.f2, n.f4, n.f3);// The current color and frame countersvar c = 0, f = 0;// A variable that holds the current timeout id (used to cancel the timeout)var timeout = null;// This function sets the "next" frame in the list to the "next" color// in the list. We call it once to start the animation, and then it // arranges to invoke itself every quarter second after that.function change_one_frame(){ // dynamically output the HTML necessary to set the background color windows[f].document.write('<BODY BGCOLOR="' + colors[c] + '">'); windows[f].document.close(); f = (f + 1) % 4; // increment frame counter c = (c + 1) % 5; // increment color counter // Arrange to be called again in 250 milliseconds // Save the timeout id so that we can stop this crazy thing. timeout = setTimeout("change_one_frame()", 250);}</SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><BODY onload=change_one_frame();><INPUT onclick="if (timeout) clearTimeout(timeout); if (!n.closed) n.close();" type=button value=' Click here to Stop '></BODY><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->