PHP Forum - animation problem

PHP Forum (http://www.selfphp.de/forum/index.php)

- HTML, CSS und JavaScript Help! (http://www.selfphp.de/forum/forumdisplay.php?f=24)

- - animation problem (http://www.selfphp.de/forum/showthread.php?t=14414)

Indyk

30.08.2006 14:39:20

animation problem

so hier kommen paar javscript fragen auf euch zu (- :

mein ziel:
ein strichmenchen welches vor einem newsticker wegläuft

problem nr_1:
ich habe noch keine animation (- ; // ist aber nicht euer problem *g*
problem nr_2:
wenn ich die position einer animation verschiebe, wird die animation jedes mal neu gestartet, oder läuft sie weiter, egal welche position javascript ihr zuweist?

ist es sozusagen möglich, wenn man eine lauf animation hat, dieses bild von A nach B zu schicken?

man müsse ja nur im ms-bereich die position wechseln, passend zum "lauftempo"
aber das sei mal alles mein problem,
ihr müsst mir nur zwei sachen sagen:
a) wird das bild neu geladen oder nicht
b) wie mache ich ein "laufbild" (müsste ja so ähnlich sein wie ein newsticker oder?

danke

xlb	30.08.2006 15:00:01

AW: animation problem

Äh - Blubb ...?!

Was für'ne Animation? Ein anmiertes Gif? Einzelbilder, die mittels JS "in Reihe" geschaltet werden sollen ?

Was soll denn wann neu geladen werden ? Wenn du Einzelbilder hast, können diese "vorgeladen" und mittels eines Timers zeitversetzt an verschiedenen Positionen angezeigt werden.

Indyk

30.08.2006 15:11:44

AW: animation problem

nein, eine animation, sei es gif oder png ist eigt. egal
du kennst ja die strichmannchen annimationen bestimmt
z.b:
beispiel

nun ist es doch so, das wenn du eine seite neu lädst, die animation immer von vorne beginnt.

und meine frage war, ob sie auch von vorne beginnt wenn du ihre position änderst.

falls dem nicht so ist, ist eigt. nur noch die frag ewie ich das männchen von A nach B schicke

xlb	30.08.2006 15:21:12

AW: animation problem

Pack die Animation in ein absolut positioniertes "div" und lasse das ganze mittels setTimeout() und einer Positionsänderung, z.B. via document.getElementbyId('ID_des_DIV').style.left=X, durch die Gegend wandern.

Dabei wird das Bild nicht neu geladen ...

Indyk

31.08.2006 09:06:44

AW: animation problem

ich kann vll. bissle php aber
javascript .. hasse ich wie die pest *g*
nicht weil es keine schöne sprache ist
ich.. habe einfach nicht genug talent dafür..

wäre also für unterstützung sehr dankbar.

PHP-Code:


		
			
function bewegung(){

var x;

var x = document.getElementById(animation).style.left;

document.getElementById(animation).style.left = x-1;



   if(document.getElementById(animation).style.left <= 100){

      document.getElementById(animation).style.left = 200;

   }

setTimeout('bewegung()',50)

}



<body onload="bewegung();">

(das die funktion in den header muss, ist mir klar)

xlb	31.08.2006 11:11:53

AW: animation problem

Ok - hier also etwas "Unterstützung". Dieses Beispiel bewegt ein IMG horizontal von 400 auf 100px (Schrittweite 20px).

Code:

<body onload="MoveImg()">



<div id="ImgX" style="position:absolute;left:400px;top:10px;;">



  <img src="NAME_DES_BILDESf">



</div>



<script type="text/javascript">



        CurrentX=parseInt(document.getElementById('ImgX').style.left);



        EndX=100;

        StepX=20;



        function MoveImg()

        {

                        if (EndX<=CurrentX)

                        {

                                document.getElementById('ImgX').style.left=CurrentX+'px';

                                CurrentX=CurrentX-StepX;

                                setTimeout('MoveImg()',100);

                        }

        }



</script>



</body>

Wenn du die Funktion in den Header basteltst, meckert, der Browser, da die Position des DIVs dann noch nicht "bekannt" ist. (no properties, bla, bla, ...).
Das parseInt() beim Auslesen der aktuellen Position ist notwendig, da einige Browser hier nicht nur den reinen Zahlenwert zurückliefern, sondern auch die Einheit hinten dranhängen (-> im FF z.B. 400px). Somit muss man's erst in einen Wert wandeln, mit dem man rechnen kann.

Indyk

27.09.2006 07:48:28

AW: animation problem

ich weiss es kommt spät und ist evtl. doof, aber warum functioniert das nicht?

PHP-Code:


		
			
function MoveImg(){

EndX=100;

StepX=2;

CurrentX="";

  if(!CurrentX){

    CurrentX=parseInt(document.getElementById('ImgX').style.left);

  }  

    if (EndX<=CurrentX){

    document.getElementById('ImgX').style.left=CurrentX+'px';

    CurrentX=CurrentX-StepX;

        alert(CurrentX);

        setTimeout('MoveImg()',20);

    }            

}

er macht CurrentX nur einmal kleiner.. und endet in einer endlosschleife
(also kein code zum ausprobieren *g*)

danke für die hilfe

Indyk

27.09.2006 08:39:03

AW: animation problem

hab mir selbst geholfen,
dnake (- ;

PHP-Code:


		
			
var CurrentX;



function MoveImg(){

EndX=100;

StepX=2;

  if(CurrentX==null){

    CurrentX=parseInt(document.getElementById('ImgX').style.left);

  }  

    if (EndX<=CurrentX){

    document.getElementById('ImgX').style.left=CurrentX+'px';

    CurrentX=CurrentX-StepX;

        alert(CurrentX);

        setTimeout('MoveImg()',20);

    }

        

}

Alle Zeitangaben in WEZ +2. Es ist jetzt 15:29:05 Uhr.