Forum Discussion

DonielleB's avatar
DonielleB
Community Member
3 months ago

Change drag and drop target and item to hidden upon drop?

I'm working on a vocabulary drag and drop interaction. The definitions are quite lengthy, so I'm limited on space. I would like to stack the vocabulary terms (drop target) on top of each other (like a stack of cards). The terms (drag item) appear separately on the slide.

Is it possible to have both the drag item and drop target change their state to hidden upon a correct drop? I tried "change state to hidden when object dropped on target", but since the drop targets are stacked it recognizes all drops as correct.

I can't seem to get it to work by "change state to hidden when drop target state is drop correct" because the interaction isn't submitting one at a time.

I appreciate all ideas.

  • I made a similar interaction, with all the "sorting cards" in one pile and two visible locations to drag the card to. These stayed in a normal state. I made all the content first, then converted it to a drag-and-drop question. 

    Then, when each draggable card was dropped at the correct location, I set its state to "Hidden." Here is a copy of the Trigger Wizard if that can help. 

    If you are looking to match two drag and drop sections, you could set up a True or False variable for each word combo. The trigger could look like "Set "DefTerm1" to true when the user drops "definition" to object and "term" to object. Then, if the value is actual, you update your Change of state trigger to the true value. I haven't tested this approach, but I assume it should work! 

    I hope this helps 🙂

  • Nedim's avatar
    Nedim
    Community Member

    You can stack the drop targets on top of each other, but instead of setting them to a "Hidden" state, it's better to move them off the slide or mask them when they disappear after the correct drag item is dropped onto the correct target. In the attached example, I used motion paths to move the drop targets across the slide when the correct drag item is placed on the correct drop target. I also used line motion paths to ensure that drag items return to their starting point when dropped on an incorrect drop zone. Attached is a short video demonstrating how this interaction works.