Kasza Róbert informatika oldala

A változóink

Deklaráljuk a változókat az animációnkhoz:

var taj=document.getElementById("taj");
var taj2=document.getElementById("taj2");
var szam=0;
var szam2=600;
var karsz=0;
var frame=0;
var idozit=0;
var t1;
var t2;

Időzítések, idővonal

Két egymástól független timert hozunk létre. Az első a háttérkép mozgatásáért felelős eljárást hívja meg, a másik a karakterünk két képének váltogatását beállító eljárást hívja meg. A főprogramunk ezzel be is fejeződött.

t1=setInterval(mozgas,10);
t2=setInterval(kar,200);

A karakter mozgása:

A karakter mozgását két kép váltogatásával érjük el:

function kar(){
if(karsz%2==0)
{
embor.src="pictures/embork1.png";
}else
{
embor.src="pictures/embork2.png";
}
karsz++;
if(karsz==2)
{
karsz=0
}
frame++;
}

A háttér mozgatása:

Két egyforma hátteret tolunk el egyszerre:

function mozgas()
{
szam2--;
szam--;
taj.style.left=szam+"px";
taj2.style.left=szam2+"px";
if(szam<=-600)
{
szam=600;
}
if(szam2<=-600)
{
szam2=600;
}
}

Az animáció elemei::

ember1

ember2

háttér

css

html

Az animációt készítette:Juhos László

Az utolsó módosítás: 2023 September 19 13:49:18.