viernes, 5 de enero de 2024

Lanzando toca pantalla

 <!DOCTYPE html>

<html>

<head>

<style>

  .cube {

    position: absolute;

    width: 50px;

    height: 50px;

    background-color: red;

    animation: move 2s linear infinite;

  }


  @keyframes move {

    from {

      transform: translate(0, 0);

    }

    to {

      transform: translate(0, 100vh);

    }

  }

</style>

</head>

<body>

  <script>

    document.addEventListener('touchstart', function(e) {

      var cube = document.createElement('div');

      cube.classList.add('cube');

      cube.style.left = e.touches[0].clientX + 'px';

      cube.style.top = e.touches[0].clientY + 'px';

      document.body.appendChild(cube);

    });

  </script>

</body>

</html>


No hay comentarios:

Publicar un comentario