Can not drag div, no translucent image of div while dragging in firefox

Question

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        When dragging the div below you see a translucent picture of the div while dragging in all browsers<p>
            except in Firefox version 60.0.2 (64-Bit)<p>
            Why ?
        <div style='border:1px solid black;display:inline-block' draggable='true'>Click inside me and drag</div>
    </body>
</html>

What has to be done to get that translucent picture also in Firefox
while dragging.

score 0 · Answer 1 · edited Jun 25 '18 at 16:02

Following code solves the issue:

<!DOCTYPE html>
<html>

<head>
  <title></title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

<body>
  <script>
    function drag(ev) {
      ev.dataTransfer.setData("text", ev.target.id);
    }
  </script>
  When dragging the div below you see a translucent picture of the div while dragging in all browsers
  <p>
    except in Firefox version 60.0.2 (64-Bit)
    <p>
      Why ?
      <div style='border:1px solid black;display:inline-block' draggable='true' ondragstart="drag(event)">Click inside me and drag</div>
</body>

</html>

Can not drag div, no translucent image of div while dragging in firefox

1 Answers1