This is my code, I've tried using setAttribute and don't understand why it doesn't work. I've also tried using .transform with the same result. setAttribute is located in the ondrop event function.

interact('.dropzone')
    .dropzone({
        // Require a 75% element overlap for a drop to be possible
        overlap: 0.75,
    
        // listen for drop related events:
    
        ondropactivate: function (event) {
            // add active dropzone feedback
            event.target.classList.add('drop-active')
        },
        ondragenter: function (event) {
            var draggableElement = event.relatedTarget
            var dropzoneElement = event.target
    
            // feedback the possibility of a drop
            dropzoneElement.classList.add('drop-target')
            draggableElement.classList.add('can-drop')
        },
        ondragleave: function (event) {
            // remove the drop feedback style
            event.target.classList.remove('drop-target')
            event.relatedTarget.classList.remove('can-drop')
        },
        ondrop: function (event) {
            console.log("here")
            event.relatedTarget.setAttribute('resize-drag', 'width:100px')
            event.relatedTarget.setAttribute('resize-drag', 'height:100px')
        },
        ondropdeactivate: function (event) {
            // remove active dropzone feedback
            event.target.classList.remove('drop-active')
            event.target.classList.remove('drop-target')
        }
    })

CodePudding user response：

Just for debugging purposes, can you try adding a classList ? That way you'll see the class appended

Create a custom class to change something visible such as the background as example. That might help you.

Also, try to provide a sandbox if you can, it's easier to help that way!