Botón huidizo

En este ejemplo te muestro un script que puedes usar para algún juego o muestra divertida. En el se coloca un botón o enlace en tu página para ser pulsado, pero que se escapa cuando el ratón intenta hacer click sobre él, de manera que nunca se puede pulsar. 

Solución

<script>

function init(){

   let si = document.getElementById('si');
   let no = document.getElementById('no');
   no.addEventListener('mouseover', saltar);

}

function nuevaPos(pos, max, incr){

   let salto = Math.round((Math.random()+1)*incr);

   let signo = Math.random() > 0.5 ? 1:-1;

   salto = signo*salto;

   if (pos + salto >= max || pos + salto <= 0){

     pos -= salto;

   }else{

    pos += salto;

   }

   return pos;

}

function saltar(evt){

   let incX = 120, incY = 30;

   let maxX = window.innerWidth - incX;

   let maxY = window.innerHeight - incY;

   let btn = evt.currentTarget;

   let posX = btn.offsetLeft;

   let posY = btn.offsetTop;

   posX = nuevaPos(posX, maxX, incX);

   posY = nuevaPos(posY, maxY, incY);

   evt.currentTarget.style.left = posX+'px';

   evt.currentTarget.style.top = posY+'px'

}

</script>

<style>

.boton{

border:1px solid red;

color: white;

background: red;

display:block;

text-align: center;

width: 120px;

height: 30px;

line-height: 30px;

position: absolute;

z-index: 2;

}

</style>

<body onload="init()">

<div class="boton" id="si" style= "top: 50%; left: 50%">Si</div>

<div class="boton" id="no" style= "top: 50%; left: 40%">No</div>

</body>

Explicación

Este botón va a saltar al acercarle el ratón.

Se define un gestor de eventos para el evento mouseover, cuando el ratón está sobre el botón (onmouseover) se invoca la función saltar().

Esta función mueve el ratón a una nueva posición limitada con las dimensiones de la pantalla. Si quieres limitarlo a un cuadro dentro de la misma puedes usar un contenedor con position:relative. Ahora el contenedor es body.

El desplazamiento se calcula de forma aleatoria con Math.random(). El mínimo es el ancho o alto del botón y el máximo el doble de este valor.

Estos anchos o altos son, como mínimo, están definidos en la regla de estilo.