Multiple Variable Drag and Drop demonstration

Suppose you wanted to present the user with a list of options from which they could select a few. Then, on the next slide, you wanted the user to categorize the options they selected by dragging them into appropriate boxes. Recently, an associate of mine was given the task of developing this activity. He ultimately developed it directly in HTML 5 using some JavaScript and JQuery coding and then embedded the result as a web object in the Storyline course he was working on.

Intrigued, I set out to see if I could do this directly in Storyline. Ultimately, I did have to resort to JavaScript to cut down on the sheer volume of triggers required but otherwise was able to accomplish it natively in Storyline. Here is a link to the published version (this link will only be accessible for 10 days as its on the Articulate Tempshare site).

Attached is the .story file and a document that will walk you through the file.

Perhaps this will give you some ideas for your own projects Enjoy!

8 Replies
Walt Hamilton


For what it's worth, I'm not sure what you want to accomplish by adding JS. What you have now is working, and seems to me to have all the functionality you want. Adding JS seems unlikely to add much to it, but will make it harder to maintain, and harder for you to modify. Two thoughts: Steve is probably using JS to carry dropped locations to other slides, whereas it seems your interactions are complete if you can get amphibians placed under cold blooded. Steve can work up something with JS in it, but if you can't create it on your own, how will you modify it? What I'm saying is that you will need to learn enough JS to create it yourself, if you want to be able to change it, if needed.

I say, "It's working and looking good. That's the goal. Time to move on."

Just my opinion.