Pure HTML and CSS game, no JavaScript

Information below the game

Difficulty: Ball: Target: Time Allowed: Frame: Freeze:

Pure HTML and CSS game

You can change the difficulty before you start

You have run out of time

Refresh to try again

You have won!

Refresh to have another go

You have lost

You clicked the bad ball!

Refresh to have another go

About the game

This game is written in HTML and CSS only, there is absolutely no JavaScript.

To Play

Aim: To click all of the balls before running out of time.

Click the balls to collect them.

If you collect all of the balls you win.

The timer (red bar) will give you 30 seconds, if you haven't collected all the balls in that time, you lose.

Refresh the page to reset the game.

There are difficulty levels available: Easy, medium and hard. These change the size of the circles.

With Bad Ball: When the bad ball is displayed, if you click the bad ball, you instantly lose. The bad ball is coloured red by default.

Bad Ball Yellow: You can choose to make the bad ball yellow rather than red, in which case one of the yellow balls is the bad ball, and the others you need to collect. You need to remember where the bad ball goes, it always follows the same route.

Target Hide: When you hover over a ball, it will begin to hide.

Time Allowed: Change the amount of time you have available.

Frame: Places a frame around the outside of the board masking off the outer edges.

Freeze: When a ball is clicked, the ball will freeze. If disabled, the ball will continue to move.

Tip: The mouse must click down and be released whilst on the ball, otherwise it will not register.

The toughest game playable is ... Difficulty: 'Hard', Ball: 'Bad Ball Yellow', Target: 'Hide', Time Allowed: '20s', Frame: Thick, Freeze: Disabled. It is possible to win with these settings.