Problema con addEventListener!

[Alexis88]

Se me ocurre hacerlo mediante un pseudo-atributo, el cual iría variando su valor y dependiendo de dicho valor, la bola sube o baja.

La bola tendría un pseudo-atributo, como puede ser data-translate y el valor "arriba":

Código HTML:

<div id="bola" data-translate="arriba"></div>
 

En la función, verificas el valor de dicho pseudo-atributo y según sea éste, la bola subirá o bajará:

Código Javascript:

function moverBola()
{
    if (bola.getAttribute("data-translate") == "arriba")
    {
        bola.style.WebkitTransform = "translateY(100px)";
        bola.setAttribute("data-translate", "abajo");
    }
    else
    {
        bola.style.WebkitTransform = "translateY(0px)";
        bola.setAttribute("data-translate", "arriba");
    }
}
 

Así es como se ve en ejecución: http://jsbin.com/ItAGAgU/2

Saludos