Prevent setAttribute from running twice

Question

I'm trying to snap an element below another element and make it stay put. The function is ok, but it runs every time I move it 10px. So it moves 10px even further each time..

   function move_box() {

    if(el.offsetLeft = 10){
        console.log('moved the element 10px to the left!');
        el.setAttribute('class', 'snap_in'); // class with css (transform: translateY(10px)

        let not_called = false; 
        console.log(not_called);

    } else if (not_called = false){
        console.log(not_called);
        el.setAttribute('class', 'dont_move'); //class with css transform:translateY(0px);
    }  
}

}

Answer 1

use '==' instead of =

you are assigning not comparing

const el = document.querySelector('.item');
let not_called;
el.addEventListener('mousedown', mousedown);

function mousedown(e){

window.addEventListener('mousemove', mousemove);
window.addEventListener('mouseup', mouseup);

let prevX = e.clientX;
let prevY = e.clientY;

function mousemove(e) {
    let newX = prevX - e.clientX;
    let newY = prevY - e.clientY;

    const rect = el.getBoundingClientRect();

    el.style.left = rect.left - newX + "px";
    el.style.top = rect.top - newY + "px";

    prevX = e.clientX;
    prevY = e.clientY;  

}
function mouseup() {
    window.removeEventListener('mousemove', mousemove);
    window.removeEventListener('mouseup', mouseup);
    console.log(el.offsetLeft);
    console.log(el.offsetTop);
    //let leftoffset = el.offsetLeft;
    if (not_called == false){
        console.log(not_called);
        el.setAttribute('class', 'item');
    }
    else if(el.offsetLeft >= 180 && el.offsetLeft <= 220){
        console.log('yes!');
        el.setAttribute('class', 'snap_in');
        not_called = false;
        console.log(not_called);

    }

}
}