Tutorial Webpage for

Lecture Cloud- and Web-Technologies


JS - Duck Shooting

Please write a simple game. The goal of the game is to shoot the black duck as often you can in one minute. However, do not shoot the yellow ducks! You will get a penalty in this case. You can play the game of the rendered solution for getting an idea how it could look like. We encourage you to develop this game further and send us your solution!
In Javascript a function is called every X milliseconds by using var myInterval = setInterval(function () {...}, X); You can stop this with window.clearInterval(myInterval);
The width of your current viewport can be determined by document.documentElement.clientWidth. You can set the x-position of the duck image to 100 px with duck.style.left = '100px'; (duck must contain the corresponding img tag). duck.offsetLeft determines the current position of the duck.
You can use the audio files ente.mp3 and failed.mp3 to play a sound of success and of the penalty respectively.


Please use the following editor for your exercise. You can run the content of the editor by clicking on the tab 'Run'...

Output of Editor Content

The result of running the editor content is as follows:

Output of the Solution

The output of the solution is as follows:


Please have a look at the solution only after you have finished working on your own solution. Otherwise the learn effect is much less.