« Le langage HTML » : différence entre les versions
Contenu supprimé Contenu ajouté
Aucun résumé des modifications |
Aucun résumé des modifications Balises : Révoqué répétition de caractères Modification par mobile Modification par le web mobile |
||
Ligne 1 :
<!DOCTYPE html>
<html>
<head>
<title>Tic Tac Toe</title>
<style>
table {
border-collapse: collapse;
margin: auto;
}
td {
width: 100px;
height: 100px;
border: 1px solid black;
text-align: center;
font-size: 60px;
font-weight: bold;
cursor: pointer;
}
#message {
display: none;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 100px;
font-weight: bold;
color: red;
z-index: 1;
}
</style>
</head>
<body>
<div id="message"></div>
<table>
<tr>
<td id="0"></td>
<td id="1"></td>
<td id="2"></td>
</tr>
<tr>
<td id="3"></td>
<td id="4"></td>
<td id="5"></td>
</tr>
<tr>
<td id="6"></td>
<td id="7"></td>
<td id="8"></td>
</tr>
</table>
<p>Score : X : <span id="scoreX">0</span> - O : <span id="scoreO">0</span></p>
<p id="timer">Temps restant : 15s</p>
<script>
var turn = "X";
var moves = ["", "", "", "", "", "", "", "", ""];
var scoreX = 0;
var scoreO = 0;
var timer;
var timeLeft = 15;
function makeMove(cell) {
if (moves[cell] == "") {
moves[cell] = turn;
document.getElementById(cell).innerHTML = turn;
if (checkWin()) {
showMessage("Victoire");
updateScore();
clearTimeout(timer);
setTimeout(resetGame, 3000);
} else if (checkTie()) {
showMessage("Match nul!");
clearTimeout(timer);
setTimeout(resetGame, 3000);
} else {
turn = (turn == "X") ? "O" : "X";
startTimer();
}
}
}
function checkWin() {
return (checkRow(0, 1, 2) || checkRow(3, 4, 5) || checkRow(6, 7, 8) ||
checkRow(0, 3, 6) || checkRow(1, 4, 7) || checkRow(2, 5, 8) ||
checkRow(0, 4, 8) || checkRow(2, 4, 6));
}
function checkRow(a, b, c) {
return (moves[a] != "" && moves[a] == moves[b] && moves[b] == moves[c]);
}
function checkTie() {
== Sommaire ==
|