-
Notifications
You must be signed in to change notification settings - Fork 0
/
clearScreen.html
50 lines (44 loc) · 1.79 KB
/
clearScreen.html
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
<!DOCTYPE html>
<!--
This assignment overall took me about 3 hours to complete. generating many circles was mu biggest challenge
this section of the assignment has taken me more than 80% of my time. I was able to solve it using a for loop
and the divs are created using an object literal method. the object literal has class and css properties associated with
CSS has to be associated here for the matter that each divs have some unique property as color and location on screen.
I have fully implemented the assignment including the EXTRA CREDIT point. The assignment is hosted on my github as usual
Regards,
Nathanael Birri
-->
<html lang="en">
<head>
<meta charset="UTF-8">
<link href="clearScreen.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="clearScreen.js" rel="script"></script>
<title>Clear Screen</title>
</head>
<body>
<div class="setting">
<fieldset class="fieldset">
<legend class="leg">Clear Screen</legend>
<label>Width :</label><input type="text" id="width" value="50"><br>
<label>Growth amount:</label><input type="text" id="growthAmount" value="10"><br>
<label>Growth rate:</label><input type="text" id="growthRate" value="250"><br>
<label>Number of Circles:</label><input type="text" id="numOfCircles" value="4"><br>
<hr>
<button id="start">Press to Start</button>
</fieldset>
</div>
<div id ="holder">
</div>
<div class="validator">
<a href="https://validator.w3.org/check/referer">
<img src="w3c-html.png" alt="html validator">
</a><br>
<a href="https://jigsaw.w3.org/css-validator/check/referer">
<img src="w3c-css.png" alt="Valid CSS!"></a><br>
<a href="https://webster.cs.washington.edu/jslint?referer">
<img src="jslint.png" alt="JavaScript Lint">
</a>
</div>
</body>
</html>