Kocka 2 animáció 1906
A pozíció meghatározásnál beírtuk a margin előszót
Bemutató példa
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="pozicio.js"> </script>
JavaScript, pozicio.js programja.
var idelem = document.getElementById("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.getElementById("pelda1906h5") ;
window.setTimeout ("idelemh5.innerHTML = ('Letelt az idő, bemutatónak V É G E ! ' ) ; idelemh5.style.backgroundColor='yellow' " , 13000);
}