Initialisation Map

master
orphevs 2017-12-08 21:14:29 +01:00
parent 9d86626f5f
commit d639fda0b0
4 changed files with 48 additions and 55 deletions

View File

@ -0,0 +1,39 @@
body{
margin: 0;
padding: 0;
font-family: sans-serif;
background: #232323;
}
.header{
text-align: center;
}
.header h1{
display: inline-block;
font-size: 42px;
padding-top: 15px;
padding-bottom: 20px;
color: #fff;
}
.map{
width: 1170px;
height: 658px;
border: solid 3px red;
background: url(../img/bg_sand.png) repeat;
position: absolute;
left: 0;
right: 0;
margin-left: auto;
margin-right: auto;
}
.block{
height: 20px;
width: 20px;
background: green;
position: absolute;
left: 50px;
top: 50px;
}

BIN
assets/img/bg_alpha.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
assets/img/bg_sand.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

View File

@ -1,63 +1,17 @@
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Tank Breaker</title> <title>de_tank</title>
<link rel="stylesheet" href="./assets/css/style.css"> <link rel="stylesheet" href="./assets/css/style.css">
<style>
body {
margin:0;
}
div.jeu {
width: 1170px;
height: 658px;
}
canvas {
width: 100%;
height: 100%;
background: #eee;
}
</style>
</head> </head>
<body> <body>
<div class="jeu"></div> <section class="header">
<h1>de_tank</h1>
<script src="./assets/js/script.js"></script> </section>
<section class="map">
<script> <div class="block"></div>
var keys = { </section>
'player1': ['z','q','s','d'],
'player2': ['ArrowUp','ArrowLeft','ArrowDown','ArrowRight']
};
window.addEventListener("keydown", function(e){
console.log(e.key);
});
var game = document.getElementById("game");
function startGame() {
myGamePiece = new component(30, 30, "red", 10, 120);
myGamePiece.gravity = 0.05;
myScore = new component("30px", "Consolas", "black", 280, 40, "text");
myGameArea.start();
}
var myGameArea = {
canvas : document.createElement("canvas"),
start : function() {
this.canvas.width = 480;
this.canvas.height = 270;
this.context = this.canvas.getContext("2d");
document.body.insertBefore(this.canvas, document.body.childNodes[0]);
this.frameNo = 0;
},
clear : function() {
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
}
}
</script>
</body> </body>
<script src="assets/js/script.js"></script>
</html> </html>