Hice un script que mueve una capa por la pagina y rebota en los costados:
Código PHP:
<script>
var posL = 1;
var posT = 1;
var flag1 = 1;
var flag2 = 1;
var i = 2; // incremento
function mover()
{
posMax = document.body.clientWidth + document.body.scrollLeft;
posMax2 = document.body.clientHeight + document.body.scrollTop;
c = document.getElementById('capa');
if (flag1)
{
if ((parseInt(c.style.left) + c.offsetWidth) >= posMax )
{
posL -=i;
flag1 = 0;
}else{
posL +=i;
flag = 1;
}
}else{
if (parseInt(c.style.left) < 1 )
{
posL +=i;
flag1 = 1;
}else{
posL -=i;
flag = 0;
}
}
if (flag2)
{
if ((parseInt(c.style.top) + c.offsetHeight) >= posMax2 )
{
posT -=i;
flag2 = 0;
}else{
posT +=i;
flag2 = 1;
}
}else{
if (parseInt(c.style.top) < 1 )
{
posT +=i;
flag2 = 1;
}else{
posT -=i;
flag2 = 0;
}
}
c.style.top = posT;
c.style.left = posL;
setTimeout("mover()",1);
}
</script>
Código HTML:
<body onload="mover()">
<div id="capa" style="position:absolute">
<table cellpadding="5">
<tr>
<td style="text-align:center; font-family:trebuchet ms; font-weight:bold; border:1px solid black; background:silver; width:200px">HOLA!! ESTA ES UNA CAPA QUE SE MUEVE :D<br>
<img src="http://webs.uolsinectis.com.ar/demi2004/fotos/sir_carajodida4_115x115.JPG"></td>
</tr>
</table>
</div>
</body>
Pero vean lo que pasa, cuando rebota en el lado derecho la capa se achata y no entiendo porque
a ver si me dan una manito.
Aca pueden verla en funcionamiento:
http://webs.uolsinectis.com.ar/demi2004/capita.htm