Ejemplo de cabecera

<head>
 <title>TODO supply a title</title>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">

 <!--Bootstrap (incluye jquery)
 -->
 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
 <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

 <!-- jquery UI (incluye js y tema)
 -->
 <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/redmond/jquery-ui.css">
 <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

 <!-- mis estilos y mi js
 -->
 <link href="estilos.css" rel="stylesheet" type="text/css"/>
 <script src="codigo.js" type="text/javascript"></script>

 </head>

Juego Ovni

 

$(function () {
 $('#comenzar').click(function(){
 $('#ufo').remove();
 ponOvni();
 });
 function ponOvni() {
 var tipo = Math.round(Math.random() * 2) + 1;
 $('#tablero').append('<img src="ufo' + tipo + '.png" id="ufo">');
 animaOvni();
 $('#ufo').click(function () {
 $('#ufo').stop(true);
 $(this).remove();
 if (confirm("Me has cazado\n¿Otra partida?")) {
 ponOvni();
 }
 });
 $('#ufo').mouseover(function () {
 $('#ufo').css('background-color', 'red');
 });
 $('#ufo').mouseout(function () {
 $('#ufo').css('background-color', '');
 });

 }
 function animaOvni() {
 var y = Math.round(Math.random() * 600);
 var x = 0;
 $('#ufo').css('top', y + "px");
 for (var i = 0; i < 6; i++) {
 y = Math.round(Math.random() * 600);
 x += 200;
 console.log($('#velocidad').val());
 $('#ufo').animate({top: y + "px", left: x + "px"}, parseInt($('#velocidad').val()));
 }
 $('#ufo').animate({top: y + "px", left: (x + 100) + "px"},
 function () {
 if (confirm("Has perdido\n¿Otra partida?")) {
 $('#ufo').remove();
 ponOvni();
 }
 });
 }
});

codigo
 index 
estilos 
 ufo2 ufo1 space