JavaScript - Elevar imagen con Javascript

   
Vista:

Elevar imagen con Javascript

Publicado por Francisco Ray (3 intervenciones) el 06/12/2016 17:36:38
Hola Buenas,

Estoy aprendiendo a utilizar Javascript y me gustaría saber cómo puedo hacer para que una imagen que cae hasta el 70% de la pantalla (luego la caída se detiene) suba cuando aprieto la tecla arriba.

Gracias :D
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

Elevar imagen con Javascript

Publicado por manuel (4 intervenciones) el 07/12/2016 09:00:34
hola yo soy bastante novato en esto asi que no se si esta sera la mejor manera, hace poco hice algo donde tenia que controlar la posicion de la imagen con las teclas del teclado y utilize algo asi :
donde "dibujo" seria tu imagen :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<script>
	window.onload=function(){document.onkeydown=desplazar};
    function desplazar(objeto){
    var tecla = objeto.which;
 
		var situacionY = document.getElementById('dibujo').offsetLeft;
         var situacionX = document.getElementById('dibujo').offsetTop;
        switch (tecla){
            case 37 :
                dibujo.style.left = situacionY-90+"px" ; break;
            case 38 :
                dibujo.style.top = situacionX-90+"px" ;break;
            case 39 :
				dibujo.style.left = situacionY+90+"px" ;break;
            case 40 :
                dibujo.style.top = situacionX+90+"px" ;break;
 
        }
    }
	</script>
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

Elevar imagen con Javascript

Publicado por Francisco Ray (3 intervenciones) el 07/12/2016 13:31:52
Muchas gracias por la aportación, pero no es exactamente lo que necesito.

Gracias y suerte aprendiendo! :D
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

Elevar imagen con Javascript

Publicado por Francisco Ray (3 intervenciones) el 07/12/2016 13:30:49
Este es el código JS que uso para que la imagen caiga hasta el 70% de la pantalla y necesito que al pulsar arriba suba:

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
var y = 10; // altura inicial y0=10%, debe leerse al iniciar si queremos que tenga alturas diferentes dependiendo del dispositivo
var v = 0;
var g = 1.622;
var a = g;
var dt = 0.016683;
var timer;
 
window.onload = function(){
    document.getElementById("showm").onclick = function () {
		document.getElementsByClassName("c")[0].style.display = "block";
		stop();
	}
	document.getElementById("hidem").onclick = function () {
		document.getElementsByClassName("c")[0].style.display = "none";
		start();
	}
	//Empezar a mover nave
	start();
}
 
 
function start(){
	timer=setInterval(function(){ moverNave();}, dt*1000);
}
 
function stop(){
	clearInterval(timer);
}
 
function moverNave(){
	v +=a*dt;
	document.getElementById("velocidad").innerHTML=v;
	y +=v*dt;
	document.getElementById("altura").innerHTML=y;
 
	//mover hasta que top sea un 70% de la pantalla
	if (y<70){
		document.getElementById("nave").style.top = y+"%";
	} else {
		stop();
	}
}
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