JAVASCRIPT – SOP1 : Background Color Change
EVENT1.html
<!DOCTYPE html>
<html>
<head>
<title>Event Driven Page1</title>
<script language="javascript">
function f1()
{
document.bgColor="red";
window.setTimeout("f2()",2000);
}
function f2()
{
document.bgColor="green";
window.setTimeout("f3()",2000);
}
function f3()
{
document.bgColor="yellow";
window.setTimeout("f4()",2000);
}
function f4()
{
document.bgColor="blue";
window.setTimeout("f5()",2000);
}
function f5()
{
document.bgColor="violet";
window.setTimeout("f6()",2000);
}
function f6()
{
document.bgColor="aqua";
window.setTimeout("f7()",2000);
}
function f7()
{
document.bgColor="pink";
window.setTimeout("f1()",2000);
}
function statusmsg()
{
window.status="Color Change";
}
</script> </head> <body>
<form name="form1">
<input type="button" value="Change Color" onmouseover="f1()">
<input type="button" value="Change Status bar" onclick="statusmsg()">
</form>
</body>
</html>
EVENT2.html
<!DOCTYPE html>
<html>
<head>
<title>Event Driven Page1</title>
<script language="javascript">
function f1()
{
document.bgColor="red";
window.setTimeout("f2()",2000);
}
function f2()
{
document.bgColor="green";
window.setTimeout("f3()",2000);
}
function f3()
{
document.bgColor="yellow";
window.setTimeout("f4()",2000);
}
function f4()
{
document.bgColor="blue";
window.setTimeout("f5()",2000);
}
function f5()
{
document.bgColor="violet";
window.setTimeout("f6()",2000);
}
function f6()
{
document.bgColor="aqua";
window.setTimeout("f7()",2000);
}
function f7()
{
document.bgColor="pink";
window.setTimeout("f1()",2000);
}
function unloading()
{
alert("Browser window unload event");
}
</script>
</head>
<body onload="f1()" onunload="unloading()">
</body>
</html>