Примерно так.
let down = (e, f) => {
e.preventDefault();
let onMouseUp = e => {
document.removeEventListener('mouseup', onMouseUp);
document.removeEventListener('mousemove', f);
};
document.addEventListener('mousemove', f);
document.addEventListener('mouseup', onMouseUp);
};
elm.onmousedown = e => {
down(e, e => {
elm_x += e.movementX;
elm_y += e.movementY;
if(elm_x > max_x)elm_x = max_x;// Ограничения right примерно так, ещё три штуки допишите для left, top, bottom.
//вводим координаты элементу. Например как ниже.
elm.style.left = elm_x+'px';
elm.style.top = elm_y+'px';
});
};
Ещё чтоб корабли ровно вставали допишите, при отпускании, деление по модулю на шаг сетки. примерно так elm_x -= elm_x % step;
