Force an element: Hover over JavaScript while dragging an element over it. No jQuery

I found a couple of search results here, but they are all for jQuery, and the couple I was looking at is not applicable to my case.

This is a small project, and so far I have avoided using jQuery. I want to keep this so as not to need a library.

Basically, I am dragging an element <article>into an element <div>. The div has a background-imageclosed dumpster. In CSS, it is set to display the same, but open, trashbin when it starts :hover.

Now, when I pull an article element into a div, the effect :hoverdoes not start. How to do it?

All the necessary elements are installed draggableand the necessary event listeners have been added, Console.log confirms that they are working.

+3
source share
1 answer

You can define a CSS class called open_trash and set the background image of open trash, and then you can use javascript to change the class of the dragged item in mousedown, like this

document.getElementById("draggedItem").className = "open_trash";

You can set the class name for an empty string, or for something else.

0
source

All Articles