Here is what i have so far : https://webte1.fei.stuba.sk/~xkvasnica/skuskove_zadanie/game.html

I want to ask if there is any library which I can use to emulate the dragging and dropping behavior in the game linked above, but for touch screens? When I try to use sortablejs, it just switches the Cards which I do not want. I was not yet able to implement touch events in JavaScript the way I want it. In sortablejs I found options for just cloning the dragged element and disabling sorting which is for most part what I want, but I cant find any drop event and some equivalent to dragenter, dragleave and drop. You can see in my game that the source of the image element changes with the dragged one. When there is no library with such funcionality I would like to implement this behavior in native Javascript using touchstart, toucheneter, touchleave but it seems to by little more complicated.

Here is function where I add event listeners, but please just check the page source code and click on linked JavaScript.

I would be so thankful for any advice.

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;
  });
} 

BTW, it is a school project but I am really stuck and we are allowed to use libraries.