Imagen en movimiento

rossz · #1 (**permalink**) 15/05/2008, 21:56

Hola, este codigo es para mover una imagen (pescado) atraves de la pantalla, pero este traspasa la pantalla, lo que quiero es que la imagen llegue a un punto en la pantalla y luego se devuelva a su sitio inicial, si me pudieran ayudar. Mil Gracias

Codigo:

<html>
<head>

<style>

.moveimage
{
position:absolute;
left:20; top:50;
z-index:2;
}

</style>
<script language="JavaScript">

var fishLeft = 20;
var imgWidth = 106;

function moveFish()
{
var elem = document.getElementById("myDiv");
fishLeft+=4;
if(fishLeft > document.body.clientWidth + (imgWidth / 2))
fishLeft = imgWidth / 2;

elem.style.left = fishLeft;
window.status= fishLeft ;
setTimeout("moveFish()", 100);
}

</script>
<title></title>
</head>
<body>

<br>
<div id="myDiv" class="moveImage"><img src="fish1.gif"></div>
<br><br><br><br><br><br><br><br><br>

<input type="button" value="Move Fish" onClick="moveFish()" ID="Button1" NAME="Button1">

</body>
</html>

rossz · #2 (**permalink**) 16/05/2008, 19:36

Consegui este: pero si quiero que el aguila se regrese despacio como lo haria?
Tambien que hace especificamente esta parte: layer1.style.left = x + 2; ???

<html>
<head>
<title>Image</title>
<script type="text/javascript">

</script>
</head>
<body bgcolor="#7D7D7D">

<br />
<div id="layer1" style="position:absolute;left:20px;top:100px;visib ility:visible;z-index:1">
<img src="http://www.forosdelweb.com/images/eagle.jpg"></div>
<br />

<div id="layer2" style="position:absolute;left:20px;top:325px;visib ility:visible;z-index:2">

<input type="button" value="Move Eagle" onClick="moveEagle()" id="Button1" name="Button1">
<input type="button" value="Return Eagle" onClick="returnLayer();">

</div>

</body>
</html>