Hello,
I am trying to add a drag and drop functionality on my Wix website through the customer Embeds -> Embed a Widget using HMTL code.
I am not very familiar with coding, so im not sure if this functionality is possible. What I am trying to do is add an image in the image uploads and read the image from the hmtl code.
I found this code online for a drag/drop functionality, however I am not sure where the code is reading the image from. I added an image through the image uploads in Wix (with ID #image8) and then I changed the HTML code to read this image ID (bottom part of the code), but it doesn't work.
Could anyone help?
Thank you in advance!
FYI: I managed to find some code online which made the drag-drop functionality work. The image URL can be found using the link posted above (https://support.wix.com/en/article/wix-editor-retrieving-the-url-of-an-image
https://www.wix.com/velo/reference/$w/image/src ) and posted in the src option below.
Regards
<!DOCTYPE HTML> <html> <head> <script> var dragValue; function move(id){ var element = document.getElementById("theDiv"); element.style.position = "absolute"; element.onmousedown = function(){ dragValue = element; } } document.onmouseup = function(e){ dragValue = null; } document.onmousemove = function(e){ var x = e.pageX; var y = e.pageY; dragValue.style.left = x + "px"; dragValue.style.top = y + "px"; } </script> </head> <body onload="move('theDiv')"> <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div> <img id="theDiv" src="https://static.wixstatic.com/media/460bd2_a58a4e3400d14ec48ff9c4720cce5797~mv2.png" draggable="true" ondragstart="drag(event)" width="156" height="69"> </body> </html>
Well a big problem I see is that "image8" is not the src of the image, you will need to get the src from the media manager or an external url:
https://support.wix.com/en/article/wix-editor-retrieving-the-url-of-an-image
https://www.wix.com/velo/reference/$w/image/src
Also since this is not specifically Velo-related you might get better help on Stack Overflow or other such sites.