Linkgrafik hin und her bewegen

[ohneworte77]

Hallo,

ich möchte mit onmouseover und onmouseout Linkgrafiken animieren. Bei onmouseover soll die Grafik(eine Patrone) langsam nach rechts wandern. Bei onmouseout soll sie wieder langsam auf ihre ursprüngliche Position zurückkehren. Bei onclick soll sie dann schneller kurz nach links und dann schnell nach rechts bis sie hinter dem nächsten Framefenster verschwindet und wieder langsam am Browserrand(links) auftaucht und zu ihrer Position zurückkehrt.
Ich hab es bis jetzt geschafft das bei onmouseover die Grafik sich wie gewünscht bewegt. Allerdings greifen weiteren Bewegungen nicht mehr. Kann mir da irgendjemand helfen??? Irgendwie klappt das nicht mit dem abbrechen der Bewegung wenn ein bestimmter Punkt erreicht ist.

[Chris]

Hi

Kann mir da irgendjemand helfen???

Ja dann poste doch mal deine Funktion die das Bild bewegt...

[Robert]

Hi,

Bei onmouseover soll die Grafik(eine Patrone) langsam nach rechts wandern. Bei onmouseout soll sie wieder langsam auf ihre ursprüngliche Position zurückkehren.

<script type="text/javascript">
 var run;
 var x = 0;
 function Move(v)
 {
   x += v;
   var Startposition = 0;
   var Endposition = 1000;
   var patrone = document.getElementById("PatronenID");
   patrone.style.left=(x)+"px";
   if (x >= Endposition)
   {
     patrone.style.left=Endposition;
     window.clearInterval(run);
     run = null;
   }
   if (x <= Startposition)
   {
     patrone.style.left=Startposition;
     window.clearInterval(run);
     run = null;
   }
 }
 function setMove(v)
 {
   run = window.setInterval("Move("+v+")",10);
 }
</script>

<a href="link.htm">
<img id="PatronenID" src="Patrone.png"
 onmouseover="window.clearInterval(run);setMove(2);"
 onmouseout="window.clearInterval(run);setMove(-2);"
 style="position:absolute;">
</a>

Das dürfte der Part sein aber, wenn du:

Bei onclick soll sie dann schneller kurz nach links und dann schnell nach rechts bis sie hinter dem nächsten Framefenster verschwindet und wieder langsam am Browserrand(links) auftaucht und zu ihrer Position zurückkehrt.

dann solltest du keine "LINKGRAFIK" benutzen sondern einen Javascript
um am Ende der Animation auf deine Seite zu springen.

mfg Robert

[Robert]

Hi,

wolltes du den script vieleicht so?

<script type="text/javascript">
 var run;
 var x = 0;
 var Ende = false;
 function Move(v)
 {
   x += v;
   var Startposition = 0;
   var Endposition = 1000;
   var patrone = document.getElementById("PatronenID");
   patrone.style.left=(x)+"px";
   if (x >= Endposition)
   {
     if (Ende == true)
     {
      window.setTimeout("window.location.href='http://www.selfhtml.org';",750);
     }
     else
     {
      patrone.style.left=Endposition;
     window.clearInterval(run);
     run = null;
     }
   }
   if (x <= Startposition)
   {
     patrone.style.left=Startposition;
     window.clearInterval(run);
     run = null;
   }
 }
 function setMove(v)
 {
   run = window.setInterval("Move("+v+")",10);
 }
</script>

<img id="PatronenID" src="Patrone.png"
 onclick="window.clearInterval(run);
    this.onmouseover = null;
    this.onmouseout = null;
    Ende = true;
    setMove(-5);
    window.setTimeout('setMove(8)',500);"
 onmouseover="window.clearInterval(run);setMove(2);"
 onmouseout="window.clearInterval(run);setMove(-2);"
 style="position:absolute;">

bei setMove(ist das die Geschwindigkeit) mit der sich das Bild bewegen soll.

mfg Robert