1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<style>
#table {
border: 8px solid #000;
background-color: #fff;
padding: 50px;
width: 400px;
height: 200px;
}
#cell {
background-color: #fff;
}
</style>
<script>
var ix;
var a= new Array( "#f00", "#0f0", "#00f", "#000", "#ff0", "#f0f", "#0ff", "#fff" );
var len= a.length;
var what= "table";
var elem;
var text;
var id;
function Init( arg ) {
what= arg;
elem= document.getElementById( arg );
text= document.getElementById( "text" );
text.value= elem.style.backgroundColor;
ix= 0;
}
function Change() {
elem.style.backgroundColor= a[ix++];
if ( ix >= len ) ix= 0;
text.value= elem.style.backgroundColor;
}
</script>
<body onload="Init('table')">
Change the color on the table more than once.
<BR>
<table id=table><tr>
<td id=cell></td>
</tr></table>
<form>
<p>Change
<label><input type=radio name=radio onclick="Init('table')"> Table</label>
<label><input type=radio name=radio onclick="Init('cell')"> Cell</label>
color</p>
<p><input type=button onclick="Change()" value="Change Color">
Table/Cell backgroundColor is <input id=text type=text size=16></p>
<p><input type=button onclick="window.id= setInterval( Change, 1000 )" value="Set Interval">
<input type=button onclick="clearInterval( window.id )" value="Clear Interval"></p>
</form>
</body>
|
