Esto es lo que tengo hasta ahora: https://webte1.fei.stuba.sk/~xkvasnica/skuskove_zadanie/game.html

Quiero preguntar si hay alguna biblioteca que pueda usar para emular el comportamiento de arrastrar y soltar en el juego vinculado anteriormente, pero para pantallas táctiles. Cuando trato de usar sortablejs, simplemente cambia las tarjetas que no quiero. Todavía no pude implementar eventos táctiles en JavaScript de la manera que quiero. En sortablejs encontré opciones para simplemente clonar el elemento arrastrado y deshabilitar la clasificación, que es en su mayor parte lo que quiero, pero no puedo encontrar ningún evento de soltar y algunos equivalentes a dragenter, dragleave y drop. Puedes ver en mi juego que la fuente del elemento de la imagen cambia con el que se arrastra. Cuando no hay una biblioteca con tal funcionalidad, me gustaría implementar este comportamiento en Javascript nativo usando touchstart, toucheneter, touchleave pero parece un poco más complicado.

Aquí está la función donde agrego detectores de eventos, pero solo verifique el código fuente de la página y haga clic en JavaScript vinculado.

Estaría muy agradecido por cualquier consejo.

 function playGame(gameLevels, level, score) { localStorage.setItem("score", String(score)); localStorage.setItem("level", String(level)); localStorage.setItem("game-levels", JSON.stringify(gameLevels)); currentLevel = []; options.innerHTML = ""; gameLevels[level].options.forEach((e) => { const img = document.createElement("img"); img.src = e.image; img.setAttribute("alt", e.name); img.classList.add("optionsImages"); img.width = 200; img.height = 200; img.style = "object-fit : cover"; currentLevel.push(img); options.appendChild(img); nameStatus.innerHTML = `${correctAnswer}`; scoreStatus.innerHTML = `Points: ${score}`; levelStatus.innerHTML = `Level: ${level + 1}/10`; }); answer.addEventListener("dragover", function (event) { event.preventDefault(); }); answer.addEventListener("drop", (e) => { e.preventDefault(); e.target.src = currentDrag; e.target.alt = currentAnswer; prevDrag = currentDrag; }); options.addEventListener("dragstart", (e) => { currentDrag = e.target.src; currentAnswer = e.target.alt; }); answer.addEventListener("dragenter", (e) => { e.target.src = currentDrag; }); answer.addEventListener("dragleave", (e) => { e.target.src = prevDrag; }); }

Por cierto, es un proyecto escolar, pero estoy realmente atascado y podemos usar bibliotecas.