Member 12214576 Ответов: 0

Функция обнаружения коллизий не работает в javascript


Я делаю небольшую игру на javascript, яйца падают, и когда они попадают в корзину, я хочу отправить яйца в исходное состояние и увеличить счет, но моя функция столкновения не работает, я новичок в javascript, и не прошло и месяца с тех пор, как я начал его изучать, поэтому я мало что знаю.

Что я уже пробовал:

вот эти переменные
var basket = document.getElementById("basketDiv");
var basketScore = document.getElementById("basketScore");
var egg1 = document.getElementById("egg1");
var egg2 = document.getElementById("egg2");
var egg3 = document.getElementById("egg3");
var egg = document.getElementsByClassName("egg");
var scoreInp = document.getElementById("Score");
var score = Number(scoreInp.innerHTML);

здесь я зацикливаюсь на яйцах, так как var egg return array-like
for(var i=0;i<egg.length;i++){
  if(checkEggHitsTheBasket(egg[i]))
    {
     setEggIntialState(egg[i]);
     dropdownEggs(egg[i]);
     }

вот моя функция столкновения я также попробовал в условии if проверить не сталкиваются ли они но также не работают
function collision(div1,div2){
    var rectX1_left  = div1.offsetLeft; //left
    var rectY1_top = div1.offsetTop;   //top
    var rectHeight1 = div1.offsetHeight;
    var rectWidth1 = div1.offsetWidth;
    var rect1_bottom = rectY1_top + rectHeight1; // bottom
    var rect1_right = rectX1_left + rectWidth1;  //right

    var rectX2_left = div2.offsetLeft; //left
    var rectY2_top = div2.offsetTop;  //top
    var rectHeight2 = div2.offsetHeight;
    var rectWidth2 = div2.offsetWidth;
    var rect2_bottom = rectY2_top + rectHeight2; //bottom
    var rect2_right = rectX2_left + rectWidth2;  //right

    if(rect1_right>rectX2_left &&rectX1_left<rect2_right&& 
        rect1_bottom > rectY2_top&& rectY1_top <rect2_bottom){
            
            return true;
        } 
    else {
    return false; 
    }   
}

вот я чечк если они столкнутся
function checkEggHitsTheBasket(egg){
    if(collision(egg,basket)){
        score++;
        scoreInp.innerHTML=score;
        basketScore.innerHTML=score;

    }
}


а также яйца и корзина у них есть позиция абсолютная и левый атрибут на %, а не px это нормально?

0 Ответов