Drag Over State not working properly

Oct 15, 2021

I'm building a simple drag and drop interaction where the user has to match titles to definitions by dragging titles to an empty box. I have added a Drag Over state (a blue glow) to each empty box to help the user know where to drop titles when he drags a word over each box.

This works but, when the user drops a word in, the glow stays there unless you drag the word back out of the box. It also disappears if you drag another word over. But otherwise, it stays in place.

Am I doing something wrong, or is this a bug? Please see attached file.

5 Replies
Marlena W

I see this is from 2 years ago, but it is still an issue. The built in Drag Over state is inconsistent. I don't want there to be a hover state for the mouse, I only want the drop areas to change to the hover state when the drag items hover over the drop areas. 

Any chance there's more info here or a proposed solution?

Grateful, Marlena

Lauren Connelly

Hello Marlena!

It sounds like you are looking for a custom setup for the Drag Over state. Are you using buttons? If so, those have a built-in Hover state. You might consider using a shape that offers you more control as to what states you add to the shape.

If you'd like to share your .story file, we can probably offer more specific support! You can share it in this discussion or privately in a support case. 

Kellyn Johnson

Hello, I am having the same issue with a DND. I believe what Marlena was stating is that the built in functionality that the Drag Over state is not working. It says on the articulate support site:

"Drag Over: This is how a drag item looks when it's dragged over a drop target or how a drop target looks when an object is dragged over it. If this state exists for an object, it'll automatically display when learners interact with the drag-and-drop scenario. You don't need to create a trigger to invoke it, but if you want to use this state in a trigger, note that trigger conditions won’t restrict its built-in function.

Those instructions say to me that if you set up your drop targets with the Drag Over state, that it should automatically change when a user drags a draggable over the drop target. This is doesn't seem to work. Can you verify if I am misunderstanding how to set that up or if there is a bug? Maybe a setting or it only works in certain situations? Thanks

Lauren Connelly

Hello Kellyn!

If I understand correctly, you are looking for the drop targets to change when an object drags over the object.

I think you are missing a small setting in your set up. In the Drag & Drop Options, make sure the check box for Delay item drop states until interaction is submitted is unchecked.

I've recorded a quick screen recording to explain this step if that helps. Please let me know if I am off base at all!