Exámenes - Tablero

En este ejercicio se debe crear un programa que permtia mover un cuadrado negro por un tablero, sin salirse de él.

Tablero - Comentarios

Tablero - Ejemplo de código HTML

<h1>Tablero</h1>

<p>Haga clic en las flechas para mover la ficha por el tablero.</p>
<form action="tablero.php" method="get">
<table border="1" cellpadding="10"><tbody>
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td style="background-color: black"></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>

 ...

  </tbody>
</table>
<p><button type="submit" name="dir" value="1"><img src="img/flecha_arriba.png" alt="Arriba" /></button>
  <button type="submit" name="dir" value="2"><img src="img/flecha_der.png" alt="Derecha" /></button>
  <button type="submit" name="dir" value="3"><img src="img/flecha_abajo.png" alt="Abajo" /></button>
  <button type="submit" name="dir" value="4"><img src="img/flecha_izq.png" alt="izquierda" /></button></p>
<p><input type="hidden" name="x" value="5" /><input type="hidden" name="y" value="1" /></p>

Tablero - Ejemplo de programa

Nota: El día del examen los alumnos no tienen acceso a este ejemplo, solamente tienen acceso a las capturas del apartado anterior.

Un ejemplo de programa puede probarse en la ventana siguiente:

ERROR (no puede mostrarse el objeto)
Enlace a ejemplo