:global([draggable]) {

-webkit-touch-callout:none;

-ms-touch-action:none; touch-action:none;

-moz-user-select:none; -webkit-user-select:none; -ms-user-select:none; user-select:none;

}

div { display:block }

:global(div.dragged) { display:none }

</style>

<script context="module">

import DragDropTouch from 'svelte-drag-drop-touch'

import { asDraggable } from 'svelte-drag-and-drop-actions'

</script>

<script>

let BoxX = 20, BoxY = 20

function onDragMove (x,y, dx,dy) { console.log('onDragMove',x,y, dx,dy) }

</script>

<p style="line-height:150%">

This example illustrates an alternative approach to "plain" dragging of a

given element by using the CSS class "dragged" which is assigned to a draggable

while it is dragged (and removed again afterwards) in combination with proper

styling

</p>

<div style="

">

<div style="