Drag and Drop questions

Jun 07, 2021

Hi all,

I have attached a single slide copy of the drag and drop I am trying to create.  I am open to alternative ideas should you have them, but for now, this is what I am trying to accomplish.

Learner will hover over one of 6 'Scenario' boxes at the bottom of the page.  The scenario becomes visible via a layer shown on hover.  

The learner then must decide if the scenario is a DO or a DON'T and drag the box to the appropriate drop location.

This part works - 

What I haven't been able to successfully build is the next part.

I would like for the dropped boxes to change to green or red depending on their accuracy of location after the leaner clicks submit.  

Assuming there are some that are incorrect, I would like the learner to either be able to reset their choices or just move them and click submit again.

Finally, I would like the 'Continue' button to be disabled until all of the boxes are correctly placed.  

Thanks in advance for any help or suggestions.

2 Replies
Maria Costa-Stienstra

Hi, A.H.

Thank you for reaching out and sharing your demo .story file!

If you want Storyline to automatically change the boxes to red or green, depending on where they are dropped, you need the Drop Correct and Drop Incorrect states in each of your objects:

Windows 10 (1) 2021-06-08 at 11.13.41 AM

I added those states to your .story file, and it's attached here. I also added a trigger to disable the Continue button when the timeline starts and another one to change it back to normal when the user clicks the submit button, and all objects are in the drop correct state

Windows 10 (1) 2021-06-08 at 11.24.11 AM

Let me know if this works!