I'm trying to create a drag and drop interaction that would do this :
On the left, a whiteboard. On the right sticky notes.
The learner has to drag and drop each sticky note on the white board. When the notes are on the whiteboard, they get smaller. But if the learner want to see them big again, he get the big image on hover.
I managed to make them small when they are on the white board but I cannot make them big again on hover. Could you please explain how i could do that? Please find attached the .story file I did.
I would simply use the build-in Hover and Drop Correct States to make this work. The Drop Correct State would look like your 'Dans la table' custom state. With that setup, the sticky note would be shown small when it is dropped on the white board (this is the drop correct state) and be shown larger when the mouse is hovered over (this is the Hover state). Hope that's what you wanted.
Thank you so much for your help. What I understand is that when you use build in states, you don't need to add triggers for the elements. It is very useful.
I have one more question: Is it possible to show the submit button only when the learner has finished a drag and drop exercise?
4 Replies
I would simply use the build-in Hover and Drop Correct States to make this work. The Drop Correct State would look like your 'Dans la table' custom state. With that setup, the sticky note would be shown small when it is dropped on the white board (this is the drop correct state) and be shown larger when the mouse is hovered over (this is the Hover state). Hope that's what you wanted.
Hi Stefania! Looks like Michael is taking care of you here, just let us know if you need anything further.
Hi Michael,
Thank you so much for your help. What I understand is that when you use build in states, you don't need to add triggers for the elements. It is very useful.
I have one more question: Is it possible to show the submit button only when the learner has finished a drag and drop exercise?
Thanks once again,
Stefania
Hi Stefania,
If you're already using the states, you could use this button to disable the built in buttons until a user has interacted with all the elements on your slide, or if you're using a custom button hide it until that point.
This discussion is closed. You can start a new discussion or contact Articulate Support.