Este artículo describe el método de JS para determinar las colisiones. Compártelo para su referencia. Los detalles son los siguientes:
JS Juzgando el método de colisión:
Copie el código de la siguiente manera:/** para determinar si está chocando
* @param obj objeto original
* @param objeto objetivo Dobj
*/
Function Impact (obj, doBJ) {
var o = {
X: getDefaultStyle (obj, 'izquierda'),
Y: getDefaultStyle (obj, 'top'),
W: getDefaultStyle (obj, 'ancho'),
H: GetDefaultStyle (obj, 'altura')
}
var d = {
X: getDefaultStyle (dobj, 'izquierda'),
Y: GetDefaultStyle (Dobj, 'Top'),
W: getDefaultStyle (dobj, 'ancho'),
H: GetDefaultStyle (dobj, 'altura')
}
var px, py;
px = ox <= dx? DX: buey;
py = oy <= dy? Dy: Oy;
// Determinar si los puntos están en ambos objetos
if (px> = ox && px <= ox + ow && py> = oy && py <= oy + oh && px> = dx && px <= dx + dw && py> = dy && py <= dy + dh) {
devolver verdadero;
} demás {
devolver falso;
}
}
/** Obtener propiedades de objetos
* @param obj objeto
* @param atributo atributo
*/
función getDefaultStyle (obj, atributo) {
return parseint (obj.currentstyle? obj.currentstyle [atributo]: document.defaultView.getComputedStyle (obj, falso) [atributo]);
}
Los ejemplos son los siguientes:
Copie el código de la siguiente manera: <
<html>
<Evista>
<title> demo </title>
<style type = "text/css">
cuerpo {margen: 0px;}
.main {posición: relativo;}
#F1 {posición: absoluto; Antecedentes:#FF0000; arriba: 100px; Izquierda: 100px; Ancho: 200px; Altura: 200px; Index Z: 999}
#f2 {posición: absoluto; Antecedentes:#FFFF00; arriba: 0px; Izquierda: 0px; Ancho: 600px; Altura: 150px;}
</style>
</ablo>
<Body>
<div>
<div id = "f1"> </div>
<div id = "f2"> </div>
</div>
<script type = "text/javaScript">
var o = document.getElementById ("f1");
var d = document.getElementById ("f2");
alerta (impacto (o, d));
Function Impact (obj, doBJ) {
var o = {
X: getDefaultStyle (obj, 'izquierda'),
Y: getDefaultStyle (obj, 'top'),
W: getDefaultStyle (obj, 'ancho'),
H: GetDefaultStyle (obj, 'altura')
}
var d = {
X: getDefaultStyle (dobj, 'izquierda'),
Y: GetDefaultStyle (Dobj, 'Top'),
W: getDefaultStyle (dobj, 'ancho'),
H: GetDefaultStyle (dobj, 'altura')
}
var px, py;
px = ox <= dx? DX: buey;
py = oy <= dy? Dy: Oy;
// Determinar si los puntos están en ambos objetos
if (px> = ox && px <= ox + ow && py> = oy && py <= oy + oh && px> = dx && px <= dx + dw && py> = dy && py <= dy + dh) {
devolver verdadero;
} demás {
devolver falso;
}
}
función getDefaultStyle (obj, atributo) {
return parseint (obj.currentstyle? obj.currentstyle [atributo]: document.defaultView.getComputedStyle (obj, falso) [atributo]);
}
</script>
</body>
</html>
Espero que este artículo sea útil para la programación de JavaScript de todos.