Std 12th IT Subject - Skill Oriented Practical (Science Stream)
Create a web page in HTML having a white background and one Button Object. Write code using JavaScript such
that when the mouse is placed over the first button object without clicking, the color of the background of
the page should change after every seconds. There should be at least 7 different and visibly distinct
background colors excluding the default color.
Create another web page using JavaScript where the background color changes automatically after every
seconds. This event must be triggered automatically after the page gets loaded in the browser. There should
be at least 7 different and visibly distinct background colors.
<html>
<head>
<title>Seven Color Changing</title>
</head>
<body>
<script language="javascript">
function color1() {
document.bgColor = "red";
window.setTimeout("color2()", 1000);
}
function color2() {
document.bgColor = "green";
window.setTimeout("color3()", 1000);
}
function color3() {
document.bgColor = "blue";
window.setTimeout("color4()", 1000);
}
function color4() {
document.bgColor = "cyan";
window.setTimeout("color5()", 1000);
}
function color5() {
document.bgColor = "magenta";
window.setTimeout("color6()", 1000);
}
function color6() {
document.bgColor = "yellow";
window.setTimeout("color7()", 1000);
}
function color7() {
document.bgColor = "lime";
window.setTimeout("color1()", 1000);
}
function msg() {
window.status = "7 Color Changing";
}
</script>
<h1>7 Color Changing</h1>
<input type="button" value="Change Color" onmouseover="color1()"><input type="button" value="Show Message"
onclick="msg()">
</body>
</html>
<html>
<head>
<title>Seven Color Changing</title>
</head>
<body onload="color1()" onunload="msg()">
<h1>7 Color Changing</h1>
</body>
<script language="javascript">
function color1() {
document.bgColor = "red";
window.setTimeout("color2()", 1000);
}
function color2() {
document.bgColor = "green";
window.setTimeout("color3()", 1000);
}
function color3() {
document.bgColor = "blue";
window.setTimeout("color4()", 1000);
}
function color4() {
document.bgColor = "cyan";
window.setTimeout("color5()", 1000);
}
function color5() {
document.bgColor = "magenta";
window.setTimeout("color6()", 1000);
}
function color6() {
document.bgColor = "yellow";
window.setTimeout("color7()", 1000);
}
function color7() {
document.bgColor = "lime";
window.setTimeout("color1()", 1000);
}
function msg() {
alert("Page Unload");
}
</script>
</html>