D. Ondula

Salida

Ábrelo en otra pestaña.

Revísalo en gilpgedit.

1<!DOCTYPE html>
2<html lang="es">
3
4<head>
5 <meta charset="UTF-8">
6 <meta name="viewport"
7 content="width=device-width">
8 <title>Ondula</title>
9 <style>
10 .sprite {
11 position: fixed;
12 font-size: 3rem;
13 }
14 </style>
15</head>
16
17<body>
18 <h1>Ondula</h1>
19 <output id="carita"
20 class="sprite">
21 😄
22 </output>
23 <script>
24 const REFRESCO = 5
25 const VELOCIDAD = 0.5
26 const FRECUENCIA = 0.03
27 let x = 0
28 setInterval(avanza, REFRESCO)
29
30 function avanza() {
31 const xMáxima = innerWidth
32 const amplitud = innerHeight / 3
33 const yBase = innerHeight / 2
34 y = yBase +
35 amplitud *
36 Math.sin(FRECUENCIA * x)
37 carita.style =
38 `left: ${x}px; bottom: ${y}px`
39 x = (x + VELOCIDAD) % xMáxima
40 }
41 </script>
42</body>
43
44</html>
skip_previous skip_next