Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » JavaScript » pelota en javascript

JavaScript - pelota en javascript

Volver
Nuevo Tema
<<>>
 
Vista:
sin imagen de perfil
Val: 50
Ha aumentado 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

pelota en javascript

Publicado por valentin (24 intervenciones) el 30/09/2019 02:34:58
Como hago para que esta pelota rebote a cada vez menos altura?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" type="text/css" href="css/estilo_canvas.css">
 
		<title>animacion</title>
 
		<script>
 
 
	  		var	maximo = 100;
 
			var tiempo = 6;
 
	  		var	y = 0;
 
			var estado="bajando";
 
			function comenzar()
			{
			var elemento=document.getElementById("lienzo");
				lienzo=elemento.getContext("2d");
 
				velocidad=setInterval(animacion,tiempo);
			}
 
			function animacion()
			{
 
				lienzo.clearRect(0,0,800,600);
 
				lienzo.beginPath();
 
				lienzo.arc(400,y,50,0,2*Math.PI,false);
 
				lienzo.fill();
 
				clearInterval(velocidad);
				if(tiempo<maximo){
   				velocidad=setInterval(animacion,tiempo++);
 
			}
 
				if (y<600 && estado=="bajando")
				{
 
				y+=60;
				}
 
				if(y==600)
				{
					estado="subiendo";
				}
 
				if(y>=0 && estado=="subiendo")
				{
 
				y-=50;
 
				}
 
				if(y==0)
				{
					estado="bajando";
				}
 
			}
 
 
 
			window.addEventListener("load",comenzar,false);
 
		</script>
 
	</head>
	<body>
		<center>
			<canvas width="800" height="600" id="lienzo"></canvas>
		</center>
	</body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Alejandro
Val: 1.448
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

pelota en javascript

Publicado por Alejandro (540 intervenciones) el 30/09/2019 15:55:04
  • Alejandro se encuentra ahora conectado en el
  • chat de PHP
No es la misma situación @joel, esta vez quiere que la altura sea la que disminuya.

@valentin trata de entenderlo, la posición inicia de las coordenadas es la esquina superior izquierda 0,0 Horizontal,Vertical respectivamente.
Dibujas la pelota en (400, y) donde y=0, y va de esa posición hasta (400, 600) y de regreso. Para que el rebote sea cada vez menor tienes que dibujar en cada rebote mayor que 0.
La linea 62 if(y==0) debería ser if(y>=maximaAltura) y maximaAltura puedes ir incrementándola cuando cambias el estado a "subiendo".
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de joel
Val: 3.506
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

pelota en javascript

Publicado por joel (895 intervenciones) el 30/09/2019 16:21:17
Entiendo... disculpa Alejandro y Valentin!!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
sin imagen de perfil
Val: 50
Ha aumentado 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

pelota en javascript

Publicado por valentin (24 intervenciones) el 01/10/2019 00:10:59
lo estoy tratando de hacer pero tengo problemas:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" type="text/css" href="css/estilo_canvas.css">
 
		<title>animacion</title>
 
		<script>
 
			var aMax = 0;
 
			var rebotes = 0;
 
	  		var	maximo = 10000;
 
			var tiempo = 60;
 
	  		var	y = 0;
 
			var estado="bajando";
 
			function comenzar()
			{
			var elemento=document.getElementById("lienzo");
				lienzo=elemento.getContext("2d");
 
				velocidad=setInterval(animacion,tiempo);
			}
 
			function animacion()
			{
 
				lienzo.clearRect(0,0,800,600);
 
				lienzo.beginPath();
 
				lienzo.arc(400,y,50,0,2*Math.PI,false);
 
				lienzo.fill();
 
				clearInterval(velocidad);
				if(tiempo<maximo){
   				velocidad=setInterval(animacion,tiempo++);
 
   				if (rebotes>21) {
 
   					aMax = 200;
 
 
   				}
 
   				if (rebotes>42) {
 
   					aMax = 400;
 
 
   				}
 
 
 
			}
 
				if (y<600 && estado=="bajando")
				{
 
				y+=60;
				}
 
				if(y==600)
				{
					estado="subiendo";
				}
 
				if(y>=aMax && estado=="subiendo" && rebotes++)
				{
 
				y-=50;
 
				}
 
				if(y==aMax)
				{
					estado="bajando";
				}
 
			}
 
 
 
			window.addEventListener("load",comenzar,false);
 
		</script>
 
	</head>
	<body>
		<center>
			<canvas width="800" height="600" id="lienzo"></canvas>
		</center>
	</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Alejandro
Val: 1.448
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

pelota en javascript

Publicado por Alejandro (540 intervenciones) el 01/10/2019 16:17:54
  • Alejandro se encuentra ahora conectado en el
  • chat de PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" type="text/css" href="css/estilo_canvas.css">
		<title>animacion</title>
 
		<script>
			var aMax = 0;
	  		var	maximo = 100;
			var tiempo = 6;
	  		var	y = 0;
			var estado="bajando";
 
			function comenzar()
			{
				var elemento=document.getElementById("lienzo");
				lienzo=elemento.getContext("2d");
				velocidad=setInterval(animacion,tiempo);
			}
 
			function animacion()
			{
				lienzo.clearRect(0,0,800,600);
				lienzo.beginPath();
				lienzo.arc(400,y,50,0,2*Math.PI,false);
				lienzo.fill();
 
				if(tiempo<maximo){
					clearInterval(velocidad);
					velocidad=setInterval(animacion,tiempo++);
				}
 
				if (estado=="bajando")
				{
					y+=60;
					if(y>=600)
					{
						y=600;
						estado="subiendo";
						aMax+=50;
					}
				}
 
				if(estado=="subiendo")
				{
					y-=50;
					if(y<=aMax)
					{
						estado="bajando";
					}
				}
 
			}
 
			window.addEventListener("load",comenzar,false);
		</script>
	</head>
 
	<body>
		<center>
			<canvas width="800" height="600" id="lienzo"></canvas>
		</center>
	</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar