Drag&Drop MY drag items are bigger than my drop targets
Jun 21, 2022
Trying to.. take email (images) (zoom in to actually read them), and then drag to either the InBox or the TrashCan. True vs. Phish
Is there anything to do be done if your drag items need to be larger than your drop targets?
I tried changing the state to have the image shrink in size on Drag Over of the drag item, but when it's placed it's normal sized (covers the drop target). I tried shrinking it in a Drop Correct and Drop Incorrect states. But then it gets buggy and shutters between normal size and shrinked size.
I set the option "Show item one at a time" could that be breaking something? Is turning on the zoom for image option, messing with re-sizing?
It just seems like i should be able to utilize the drop- states in States, so the email image doesn't "live" overtop of the drop target!
A
3 Replies
Hey Alison. One thing you can do is work with smaller versions of each object that are hidden by default. Then, after each object is dropped on a target, you can change the states of the smaller, hidden version to indicate where the drag object was dropped.
Here's an example: https://community.articulate.com/download/storyline-360-drag-and-drop-matching-labels
So maybe because I did 4 interviews + boss mtg in last 4 hours, but.. I'm wondering why your Drop Targets are not the orange lines but that you created (well, hotspots- just to really confuse things) . But they ARE green, semi-transparent rectangles on top of the lines.
Why?
Is it that it fits better (more accurately) when the correct drag item arrives?
Dumb Question: you can't put Drag Items under the Drop target can you?
Alison
You can place drag objects below their drop targets. But once the learner clicks the drag object, it will automatically jump to the top of the stacking order.
In the labels example, I found it quicker and easier to include the red underlines as part of the overall text block. I could have typed out the text, left space for the underlines, and then added the lines individually.
Using the hotspots over red lines for drop targets gives the learners a larger drop area. So the lines would work, but the hotspots create a larger target for the drag objects. But you could go either way.