Multiple Variable Drag and Drop demonstration
Jul 30, 2014
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
Hmmm... The .story file didn't attach. Trying again.
Hi Steve,
Please help me in achieving the below Drag and drop using Javascript.
Hi Nandish,
I will try to work on this for you this weekend. You have done a great job of accomplishing the exercise directly in Storyline but I can understand why you would want to simplify this using JavaScript.
Thank you so much Steve, it will be a great help. :)
Hi Steve, looking forward to your reply. Eagerly waiting :)
Hi Nandish,
I'm still working on this. It's an interesting problem. I'll let you know what I come up with but I may not be able to complete this today.
Ok Steve, :)
Nandish,
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.