if bedingung

[michael.s]

hallo Leute,

ich habe ein kleines Problem bei einem JS-Spiel.

Also ich habe die Position von einem bewegten Objekt (mit settimeout) und einem div-objekt das von der Maus gesteuert wird.
Nun soll, wenn das bewegte Objekt (ball) auf die Maus trifft (nur zur Überprüfung) ein alert aufgehen.

ich habe mir das so gedacht

if (xpositionball == xpositionmaus && ypositionball == ypositionmaus)
alert('hallo');

aber das funktioniert nicht..

wieso???
bitte Hilfe

dankeschön

michi

[suit]

Wann wird diese bedingte Verzweigung ausgeführt?

[michael.s]

Wann wird diese bedingte Verzweigung ausgeführt?

Ich stell mal den ganzen Code rein.. erklären wird oft kompliziert:

xpos=700;
ypos=0;
xrichtung="rechts";
yrichtung="oben";
xstep=5;
ystep=5;
tore=0;

function move(m)
{
    if(xrichtung=="rechts"){xpos+=xstep;}
    else{xpos-=xstep;}

if(yrichtung=="oben"){ypos-=ystep;}
    else {ypos+=ystep;}

//Randabfrage
    if(xpos>735)
    {
        xstep=10;
        xrichtung="links";
    }
document.getElementById('3').innerHTML = "Ball: xpos:" + xpos + "<br /> ypos:" + ypos;

if (xpos==x && ypos==y)
    alert('hey');

if(xpos<13)
    {
        xstep=15;
        xrichtung="rechts";
    }
    if(ypos<0)
    {
        ystep=Math.round(Math.random()*7)+5;
        yrichtung="runter";
    }

//Tor checken
    if(xpos<13 && ypos>160 && ypos<50+160)
    {
        //Tor
        tore++;
        document.getElementById("ausgabe").innerHTML="Tore: "+tore;
        xpos=300;
        xrichtung="rechts";
    }

document.getElementById("ball").style.top=ypos+"px";
    document.getElementById("ball").style.left=xpos+"px";

setTimeout("move()",190);

}
move();

s="<div id='rahmen'>";

s+="<div id='block'></div>";

document.write(s);

document.onmousemove = Maus;
 var x;
 var y;
function Maus(Ereignis)
{
    if(!Ereignis)Ereignis = window.event;
     x= Ereignis.clientX;
    if(x<0)x=0;
    if(x+50>773)x=730;

y= Ereignis.clientY;
    if(y<0)y=0;
    if(y+50>773)y=730;

document.getElementById("block").style.left=x+"px";

document.getElementById('1').innerHTML = "Maus: x:" + x;
        document.getElementById('2').innerHTML = "Maus: y:" + y;

}

[EKKi]

Mahlzeit michael.s,

»» Wann wird diese bedingte Verzweigung ausgeführt?

Ich stell mal den ganzen Code rein.. erklären wird oft kompliziert:

Stimmt - dann müsstest Du Dir ja auch Gedanken machen ...

Ich sehe übrigens NIRGENDWO in dem von Dir geposteten Code die im Eingangsposting erwähnte Zeile.

Welches konkrete Problem hast Du noch gleich?

MfG,
EKKi

[michael.s]

Stimmt - dann müsstest Du Dir ja auch Gedanken machen ...

Ja ich bin nicht so das Genie in JS.. hab das hier irgndwie zusammengebastelt..

Der teil in dem Code heißt

if (xpos==x && ypos==y)
    alert('hey');

und das Problem ist dass hier bei überschneidung von Ball und Maus ein alert Fenster erscheinen sollte.. tut es aber nicht

xpos=700;
ypos=0;
xrichtung="rechts";
yrichtung="oben";
xstep=5;
ystep=5;
tore=0;

function move(m)
{
    if(xrichtung=="rechts"){xpos+=xstep;}
    else{xpos-=xstep;}

if(yrichtung=="oben"){ypos-=ystep;}
    else {ypos+=ystep;}

//Randabfrage
    if(xpos>735)
    {
        xstep=10;
        xrichtung="links";
    }
document.getElementById('3').innerHTML = "Ball: xpos:" + xpos + "<br /> ypos:" + ypos;

if (xpos==x && ypos==y)
    alert('hey');

if(xpos<13)
    {
        xstep=15;
        xrichtung="rechts";
    }
    if(ypos<0)
    {
        ystep=Math.round(Math.random()*7)+5;
        yrichtung="runter";
    }

//Tor checken
    if(xpos<13 && ypos>160 && ypos<50+160)
    {
        //Tor
        tore++;
        document.getElementById("ausgabe").innerHTML="Tore: "+tore;
        xpos=300;
        xrichtung="rechts";
    }

document.getElementById("ball").style.top=ypos+"px";
    document.getElementById("ball").style.left=xpos+"px";

setTimeout("move()",190);

}
move();

s="<div id='rahmen'>";

s+="<div id='block'></div>";

document.write(s);

document.onmousemove = Maus;
 var x;
 var y;
function Maus(Ereignis)
{
    if(!Ereignis)Ereignis = window.event;
     x= Ereignis.clientX;
    if(x<0)x=0;
    if(x+50>773)x=730;

y= Ereignis.clientY;
    if(y<0)y=0;
    if(y+50>773)y=730;

document.getElementById("block").style.left=x+"px";

document.getElementById('1').innerHTML = "Maus: x:" + x;
        document.getElementById('2').innerHTML = "Maus: y:" + y;

}

[suit]

und das Problem ist dass hier bei überschneidung von Ball und Maus ein alert Fenster erscheinen sollte.. tut es aber nicht

Was spricht gegen ein simples onmouseover-Event auf deinem Ball?

[michael.s]

weil die Maus nicht gleich die Maus ist ^^
horcht sich verwirrend bei mir an
aber ich fahr nicht mit der Maus drüber.. sonders ein div-objekt bewegt sich am unteren bildschirmrand nur entlang der x-Achse und die Maus kann gleichzeitig wo anders sein.. es geht nur um die Bewegung der Maus
und wenn ich dann ein onmouseover mache.. gilt dies für die Maus und nicht für das Objekt..

[ChrisB]

Hi,

if (xpos==x && ypos==y)
    alert('hey');

und das Problem ist dass hier bei überschneidung von Ball und Maus ein alert Fenster erscheinen sollte.. tut es aber nicht

Das, was du da abfragst, sind nur die Koordinaten, an denen sich die jeweils linken oberen Ecken der Objekte befinden.

"Überschneiden" werden sie sich aber vermutlich auch dann, wenn diese beiden Ecken nicht exakt übereinander liegen.

_____                     _____
 |  ___|__              ___|__   |
 | |   |  |            |   |  |  |
 |_|___|  |            |   |__|__|
   |______|            |______|

Auch diese beiden beispielhaften Fälle dürften "Überschneidungen" darstellen.

Ja ich bin nicht so das Genie in JS..

Das interessiert ja auch erst mal nicht - erst mal gilt es, das Problem mathematisch anzugehen.

Also überlege dir mal eine Formel oder Gleichung, mit der man an hand der Koordinaten der oberen linken Ecken und der Breite und Höhe beider Objekte berechnen/ermitteln kann, ob sie sich überschneiden.

Wenn du das hast, und auf dem Papier ein paar Testfälle durchgespielt hast (sowohl für Überschneidung als auch für nicht), und deine Formel/Bedingung sich als tauglich erwiesen hat - *dann* kannst du anfangen, diese im JavaScript umzusetzen.

Und wenn du weitere Fragen dazu stellen willst - dann beschreibe bitte genauer, welche Gedanken du dir dazu gemacht hast, und wo du nicht weiter kommst.
Das ist schliesslich schon dein dritter Thread zum Thema in den letzten Tagen (die anderen beiden sind auf dem Weg ins Archiv) - und auch dieser hier enthielt von deiner Seite bisher wenig konkretes, sondern wieder nur hingeworfenen Code und "funzt nich" als Pseudo-Problembeschreibung.
Wenn du hier Hilfe bekommen willst, dann sollte von dir schon etwas mehr Eigenleistung kommen!

MfG ChrisB