[Solved] Brick breaker game with JavaScript + HTML + Canvas

  

3
Topic starter

I need to create a game: Brick breaker game with:

  • JavaScript
  • HTML
  • Canvas

It must consist of bricks and a ball on a paddle must destroy them;

See the screenshot provided. Thanks

brick breaker ball game with javascript HTML and Canvas

1 Answer
2

>> HERE IS THE GAME ONLINE << (GitHub io page)


See the game in action HERE

Here is the HTML:

<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8"/>
   <!-- To disable zooming , I have setup my viewport so that it is not user scalable -->
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Game Arima</title>
   <META NAME="robots" CONTENT="noindex, nofollow">
 
 
   <link rel="stylesheet prefetch" type="text/css" href="css/game.css">
   <script src="js/game.js" defer></script>
    
</head>
 
<body>
<canvas id="myCanvas" width="500" height="500"></canvas>
 
</body>
</html>

CSS file:

body{
background-color:#fff;
}
 
#myCanvas
{
    display: block;
    margin: 0 auto;
    margin-top:10px;
    background-image: url("http://arima.bg/game/game.jpg");
    /*background-color:#2A2927;*/
    border-radius: 10px;
    border-bottom:35px solid #C2AA83;
    box-shadow: 3px 3px 0px #888888;
    padding-top:25px;
}

JavaScript file: SEE HERE

Share: