-1

I'm working on making an image mask where you can drag the elements around to reveal the part of the image that the element covers. It's fairly easy to make a mask like this with SVG as seen below:

<svg viewBox="0 0 2458 1235" class="w-full">
          <mask id="svgmask3">
            <circle
              fill="#ffffff"
              cx="80"
              cy="260"
              r="75"
            ></circle>
            <circle
              fill="#ffffff"
              cx="270"
              cy="160"
              r="75"
            ></circle>
          </mask>
          <image
            href=""
            mask="url(#svgmask3)"
            class="w-screen"
          ></image>
        </svg>

When I try to make one of these circles draggable, though, no matter what solid library I use, the entire page just dissapears when I implement it. For example, as soon as I add the use:draggable directive in solid-dnd, the entire page dissapears. Same with neodrag/solid. I'm at a loss here. I have no idea what to do.

woop de schwoop
  • 95
  • 1
  • 8
  • Can you share your code, it is not possible to locate the problem from a simple jsx element? – snnsnn Sep 01 '23 at 10:12

0 Answers0