Objektum pozíciója a köríven. 3520

Haladási irány: Balra forgás

Mozillában csak akkor működik, ha kiiktatjuk a DOCTYPE meghatározást:
<-- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> -->
<html xmlns="http://www.w3.org/1999/xhtml">
<html>

Azon szakaszt, területet, melyben a kockakép mozog, utólagosan állítjuk be arra a méretre, melyet, a mozgó objektum bejár.
Ha, nem helyezünk el   üres bekezdéseket, vagy megfelelő méretű div szakaszt, akkor a mozgó objektum, a dokumentumunk szövegterületén mozog.
Teszteljük le úgy is, hogy a   üres bekezdéseket, töröljük programunkból.

A kocka, aktuális pozíciójának kiíratása

Első x = 000 Első y = 000

Második x = 000 Második y = 000

Harmadik x = 000 Harmadik y = 000

Negyedik x = 000 Negyedik y = 000

XHTML fájl:
<div class="bemutato">
 A kocka, aktuális pozíciójának kiíratása 
 Első x = 000 Első y = 000
 Második x = 000 Második y = 000
 Harmadik x = 000 Harmadik y = 000
 Negyedik x = 000 Negyedik y = 000
</div>

<img src="kep15x15.jpg" width="15px" height="15px" id="kocka1" class="kocka1" />

<script language="JavaScript" type="text/javascript" src="js_fájl_elérési_útvonala.js"> </script>

CSS fájl:
.kocka1 {position: absolute; margin-top: 200px; margin-left: 200px; }

JavaScript programunk:
var x=0; // idelem, azaz objektum függőleges érték
var y=0; // idelem, azaz objektum vízszintes érték

var a1=0; //első képlethez
var a2=0; //második képlethez
var a3=0; //harmadik képlethez
var a4=0; //negyedik képlethez
var bb=0;
var r=100;

var qq=1;
var gyokk=0;

var ido2 = window.setTimeout ("Update2(); " , 50) ;
var idelem = document.getElementById("kocka1") ;

var pozicio1 = document.getElementById("pos1") ;
var pozicio2 = document.getElementById("pos2") ;
var pozicio3 = document.getElementById("pos3") ;
var pozicio4 = document.getElementById("pos4") ;

function Update2 () {
qq++;
idelem.style.marginLeft = y;
idelem.style.marginTop = x;

// Első
if (qq<101) {
function uzenettorles ( ) {
pozicio1 = document. getElementById ("pos1");
pozicio1.innerHTML = " ";
}
a1++; gyokk= Math.sqrt((r*r)-(a1*a1)); bb=parseInt(gyokk);
x=200+a1; y=300-bb;

pozicio1 = document.getElementById ("pos1");
pozicio1.innerHTML =("Első x = "+ x +" Első y = "+ y);
bqq=200;
}

// Második
else if (bqq>=200 && bqq<=299) { bqq++;
function uzenettorles ( ) {
pozicio2 = document. getElementById ("pos2");
pozicio2.innerHTML = " ";
}
gyokk= Math.sqrt((r*r)-(a2*a2)); bb=parseInt(gyokk);
x=200+bb; y=300+a2;

pozicio2 = document.getElementById ("pos2");
pozicio2.innerHTML =("Második x = "+ x +" Második y = "+ y);
cqq=400;
aa2++;
}

//Harmadik
else if (cqq>=400 && cqq<=499) { cqq++;
function uzenettorles ( ) {
pozicio3 = document. getElementById ("pos3");
pozicio3.innerHTML = " ";
}
a3++; gyokk= Math.sqrt((r*r)-(a3*a3)); bb=parseInt(gyokk);
x=200-aa3; y=300-(-bb*1);

pozicio3 = document.getElementById ("pos3");
pozicio3.innerHTML =("Harmadik x = "+ x +" Harmadik y = "+ y);
dqq=600;
}

//Negyedik
else if (dqq>=600 && dqq<=699) {dqq++;
function uzenettorles ( ) {
pozicio4 = document. getElementById ("pos4");
pozicio4.innerHTML = " ";
}
a4++; gyokk= Math.sqrt((r*r)-(a4*a4)); bb=parseInt(gyokk);
x=200+(-bb*1); y=y-1;

pozicio4 = document.getElementById ("pos4");
pozicio4.innerHTML =("Negyedik x = "+ x +" Negyedik y = "+ y);
}

else {qq=0; a1=0; a2=0; a3=0; a4=0; x=200; y=200;};

//Az időzítő funkció
ido2 = window.setTimeout("Update2(); " , 50) ;
}

Vissza a lap elejére