Note that, if you use a Search Engine to find similar programs on the web, we will find these programs too. So don't do it because you will get caught and you will get an F in the course (this is cheating). Don't look for code to use for your project on the web or from other students (current or past). Just do your project alone using the help given in this project description and from your instructor and GTA only. Finally, you should not post your code nor deploy your project on a public web site.
You will do this project on your own PC/laptop. You have to use
either the Mozilla Firefox or the Google Chrome web browser to run and
"Debugger", and click on "Show in Separate Window" to get the debugger
on a separate window. On Chrome, select "More tools" then "Developer
Tools", then click on "Undock into separate window".
The court is 1000x600px and the photos have width 80px, but you should make your program work for any size of court, and any number and size of photos. The initial position of each photo is a random place inside the court. When you click on the court, photos will start moving in random directions and random speeds. The photos bounce on the court sides and on each other. When you click on the court again, the animation is suspended, when you click again, the animation resumes, etc. So each time you click, it suspends or resumes.
<p id="x" style="position: absolute; left: 50px; top: 100px;"> ... </p>To move this element, just change the left/top attributes using code:
document.getElementById("x").style.top = "10px";Note that the values that you set the left/top attributes must have units (e.g., "10px"). It will not work if you set them to numbers.
Use the form below to submit your photos.html and photos.js files. We do not accept email or hardcopy submissions. These files are automatically uploaded directly into your personal class account for this particular project, so you don't have to include your name or student ID or project number in the file name. You may submit your files as many times as you like, but only the most recently submitted files will be retained and evaluated (newly submitted files replace the old files under the same file name). After you submit the files, please double-check that your submitted files are correct by clicking on the Status link and by playing your animation on your browser.Last modified: 09/09/2019 by Leonidas Fegaras