Código de JavaScript - Movimiento aleatorio bounce simple

Pos: 4

Val: 2.019

Ha mantenido su posición en JavaScript (en relación al último mes)

Movimiento aleatorio bounce simple

JavaScript

(3)

Publicado el 4 de Noviembre del 2016 por Scriptshow (141 códigos)

5.556 visualizaciones desde el 4 de Noviembre del 2016

Código resumido al máximo para un efecto bounce de un objeto por la zona visible del navegador.
Puede ser la base para crear un Pong; Banner; Salvapantallas...

Para experimentar, en definitiva...

Requerimientos

Un navegador o dispositivo compatible.

1.0
(3)

Actualizado el 7 de Noviembre del 2016 (Publicado el 4 de Noviembre del 2016)

gráfica de visualizaciones de la versión: 1.0

5.557 visualizaciones desde el 4 de Noviembre del 2016

<!DOCTYPE html>

<html>

<head>

<script>

var vx=1;

var vy=1;

function mover()

posx=parseInt(document.getElementById("quad").style.left);

posy=parseInt(document.getElementById("quad").style.top);

posx=posx + vx;

posy=posy + vy;

if(posx>=(document.body.offsetWidth-60||window.innerWidth-60)||(posx<=0)) vx=-vx;

if(posy>=(document.body.offsetHeight-60||window.innerHeight-60)||(posy<=0)) vy=-vy;

document.getElementById("quad").style.left=posx + "px";

document.getElementById("quad").style.top=posy + "px";

setInterval("mover()", 10);

</script>

</head>

<body style="margin:0px;width:100%;height:100%;">

<div id="quad" style="position:relative;left:0px;top:0px;width:60px;height:60px;background:teal;"></div>

</body>

</html>

Comentarios sobre la versión: 1.0 (3)

kip

4 de Noviembre del 2016

Muy bueno!!

Responder

xve

6 de Noviembre del 2016

Que simple ScriptShow!!! muy bueno!!!

Responder

Miguel

8 de Noviembre del 2016

Genial!!!!

Responder

Comentar la versión: 1.0

http://lwp-l.com/s3734

Cambiar el aspecto de un elemento al mover el scroll

Texto junto al puntero del mouse

Código de JavaScript - Movimiento aleatorio bounce simple

Requerimientos

1.0(3)

Comentarios sobre la versión: 1.0 (3)

Comentar la versión: 1.0

Tienes que ser un usuario registrado para poder insertar imágenes, archivos y/o videos.

1.0
(3)