|
|
Kocka 2 animáció
Mobilváltozat!
Asztali változathoz,
kattints a képre!
Bemutató.
A pozíció meghatározásnál beírtuk a margin előszót
Amíg az adott objektumra vonatkozó stílust, előzetesen meg nem határozzuk, addig a jávascript nem módosítja a programunk objektum pozícióját.
Az xhtml fájl megírása
<h5 id="pelda1906h5"> Bemutató példa </h5>
<img src="peldakep19/ kep15x15.jpg" width="15px" height="15px" id= "masodikkocka" class="kocka" />
<div class= "animaciodiv">
</div>
<script language= "JavaScript" type= "text/javascript" src= "pelda1906js.js" > </script>
JavaScript programja
var idelem = document. getElement ById ("masodikkocka") ;
{
window.setTimeout (' idelem.style. marginTop="5px" ; idelem.style. marginLeft="50px" ' , 1500);
window.setTimeout (' idelem.style. marginTop="5px" ; idelem.style. marginLeft="100px" ' , 2000);
window.setTimeout (' idelem.style. marginTop="5px" ; idelem.style. marginLeft="150px" ' , 2500);
window.setTimeout (' idelem.style. marginTop="5px" ; idelem.style. marginLeft="200px" ' , 3000);
window.setTimeout (' idelem.style. marginTop="5px" ; idelem.style. marginLeft="250px" ' , 3500);
window.setTimeout (' idelem.style. marginTop="5px" ; idelem.style. marginLeft="300px" ' , 4000);
window.setTimeout (" idelem.style. marginTop='35px' ; idelem.style. marginLeft='300px' " , 4500);
window.setTimeout (" idelem.style. marginTop='50px' ; idelem.style. marginLeft='300px' " , 5000);
window.setTimeout (" idelem.style. marginTop='75px' ; idelem.style. marginLeft='300px' " , 5500);
window.setTimeout (" idelem.style. marginTop='100px' ; idelem.style. marginLeft='300px' " , 6000);
window.setTimeout (" idelem.style. marginTop='125px' ; idelem.style. marginLeft='300px' " , 6500);
window.setTimeout (" idelem.style. marginTop='150px' ; idelem.style. marginLeft='300px' " , 7000);
window.setTimeout (" idelem.style. marginTop='150px' ; idelem.style. marginLeft='250px' " , 7500);
window.setTimeout (" idelem.style. marginTop='150px' ; idelem.style. marginLeft='200px' " , 8000);
window.setTimeout (" idelem.style. marginTop='150px' ; idelem.style. marginLeft='150px' " , 8500);
window.setTimeout (" idelem.style. marginTop='150px' ; idelem.style. marginLeft='100px' " , 9000);
window.setTimeout (" idelem.style. marginTop='150px' ; idelem.style. marginLeft='50px' " , 9500);
window.setTimeout (" idelem.style. marginTop='125px' ; idelem.style. marginLeft='50px' " , 10000);
window.setTimeout (" idelem.style. marginTop='100px' ; idelem.style. marginLeft='50px' " , 10500);
window.setTimeout (" idelem.style. marginTop='75px' ; idelem.style. marginLeft='50px' " , 11000);
window.setTimeout (" idelem.style. marginTop='50px' ; idelem.style. marginLeft='50px' " , 11500);
window.setTimeout (" idelem.style. marginTop='25px' ; idelem.style. marginLeft='50px' " , 12000);
window.setTimeout (" idelem.style. marginTop='5px' ; idelem.style. marginLeft='50px' " , 12500);
var idelemh5= document. getElement ById ("pelda1906h5") ;
window.setTimeout ("idelemh5. innerHTML = ('Letelt az idő, bemutatónak V É G E ! ' ) ; idelemh5.style. background Color='yellow' " , 13000);
}