Per la sovrapposizione orizzonale le condizioni sono che il limite inferiore dell'oggetto sia maggiore o uguale al limite superiore dell'ostacolo e il limite superiore dell'oggetto sia minore o uguale al limite inferiore dell'ostacolo.
Rendiamolo...
function horOver(ogg,ost){ if(basso(ogg)>=alto(ost) && alto(ogg)<=basso(ost)) return true; }Adesso, per provare questo, mi creo un div "spia" nella pagina principale.
<div id="test"></div>con il suo stile:
#test{ width:100px; height:20px; border:2px solid black; top:0px; left:0px; position:absolute; }
Bene.
Ora testiamo la funzione...
Ci sono stati un po' di problemi perchè non ricordavo come gestire la proprietà position se absolute o relative.
Ecco che ho sistemato la questione... Sì.
Nella DIV denominata "test" ottengo se è vero o falso che oggetto e ostacolo si sovrappongono in orizzontale, con questa aggiunta alla funzione OnMouseMove:
function OnMouseMove(){
oggetto.style.left=BaseX+event.clientX-MouseX;
oggetto.style.top=BaseY+event.clientY-MouseY;
$("test").innerHTML=horOver(oggetto,ostacolo);
}
Ora però voglio inserire, come parametri, non l'oggetto ma le sue coordinate. Mi servirà successivamente per superare i grossi problemi che ho incontrato nei miei tentativi precedenti che mi hanno fatto ammattire...
Ci provo.
Ecco! come parametri pongo oggHi che corrisponde al limite alto dell'oggetto, e oggLo che ne è il limite basso.
function horOver(oggHi,oggLo,ost){ if(oggLo>=alto(ost) && oggHi<=basso(ost)) return true; }E funziona lo stesso: la mia casella test mi segnala ugualmente true quando si ha la sovrapposizione orizzontale dell'oggetto.
Ora vediamo pure con la sovrapposizione verticale...
function vertOver(oggSx, oggDx, ost){ if(oggDx>=sinistro(ost) && oggSx <destro(ost)) return true; }che viene correttamente svelata dalla mia casella test con il seguente codice nella funzione OnMouseMove:
function OnMouseMove(){ oggetto.style.left=BaseX+event.clientX-MouseX; oggetto.style.top=BaseY+event.clientY-MouseY: $("test").innerHTML=vertOver(sinistro(oggetto),destro(oggetto),ostacolo); }Perfetto.
Quindi la sovrapposizione completa dell'oggetto all'ostacolo sarà data dalla contemporanea condizione di true per le due funzioni horOver e vertOver.
Ecco, infatti le due funzioni:
function horOver(oggHi,oggLo,ost){ if(oggLo>=alto(ost) && oggHi<=basso(ost)) return true; } function vertOver(oggSx, oggDx, ost){ if(oggDx>=sinistro(ost) && oggSx <destro(ost)) return true; }e il codice che ne rileva il risultato nella casella test.
function OnMouseMove(){
oggetto.style.left=BaseX+event.clientX-MouseX;
oggetto.style.top=BaseY+event.clientY-MouseY;
if(horOver(alto(oggetto),basso(oggetto),ostacolo) && vertOver(sinistro(oggetto),destro(oggetto),ostacolo)) {
$("test").innerHTML="sovrapposto";
}else{
$("test").innerHTML=" ";
}
}
Bene.Per oggi è sufficiente!
Nessun commento:
Posta un commento