Bevæge billede - Javascript
Jeg skodder for vildt til javascript, men skulle lige prøve at lave en simpel menu alligevel. Det lykkedes selvfølgelig ikke, hvorfor jeg nu beder om hjælp.Ideen:
Der er en række med knapper (links). Nedenunder er der en pil (en billedefil) der til at starte med peger op på den første af knapperne. Trykker man på en af de andre knapper kører pilen hen, og peger i stedet på denne knap.
Mit forsøg (kode):
<html>
<head>
<title>Menuen</title>
<script language="javascript">
var linkpos = 20;
var i=1;
function bevaeg(pos){
var dist = pos - linkpos;
var num;
if(dist < 0){
num = -1*dist;
}else{
num = dist;
}
antal = num/150;
pilen.style.position="relative"
if(dist < 0){
pilen.style.left=+i;
i--;
timer=setTimeout("bevaeg(pos)",antal);
if(i < dist){
stoptimer(pos);
}
}else{
pilen.style.left=+i;
i++;
timer=setTimeout("bevaeg(pos)",antal);
if(i > dist){
stoptimer(pos);
}
}
function stoptimer(pos)
{
clearTimeout(timer);
linkpos = pos;
}
</script>
</head>
<body>
<img src="knap.gif" Alt="Link 1" onClick="bevaeg(20)">
<img src="knap.gif" Alt="Link 2" onClick="bevaeg(80)">
<img src="knap.gif" Alt="Link 3" onClick="bevaeg(140)"> <br>
<img src="pil.gif" id="pilen" Alt="Pil" style="position:relative;left:20;">
</body>
</html>
Problemet:
Den rokker sig ikke ud af stedet. Ved godt at jeg sikkert mangler en masse, og har gjort en masse forkert, men jeg kan ikke overskue det lige nu :)
Håber nogen kan hjælpe.
På forhånd tak for hjælpen!
Hono
