I have created a drag and drop activity using a jquery approach but have found some inconsistencies with its performance. The attached Hype specific alternative is perfect for my needs and I could adapt, but Im not a programmer, and struggle with the concepts. The .js within this file includes only a function for completion of all matches to trigger another action. All I need to be able to do is start independent timelines off of the individual D&D matches in addition to the completion check. Any advice however trivial or basic would be appreciated.dragAndDropHypeStyle2.hype.zip (53.4 KB)
did a new one … you may try it:
The enabler is brilliant. I think that is a perfect solution for non-scripting types like myself.
The responsiveness is great, which is why I went with jquery in the first place. I appreciate this work greatly, but I was hoping for a simple adaptation to the original script for the sake of simplicity. I need to adapt this to a number of different exercises and may be too far into it to rethink it. I fully understand that I am not in a position to have any expectations though.
hitCheck returns an object if true.
it consists of:
element: -> the dropped element
id: the id of the dropped element
classList: the classList of the dropped element
element as argument from the hypefunction is the dragged one.
these are the circumstances to work with …
i would set a data-attribute to the droppable elements that holds the timeline to play.
so you can access this on hitCheck … and play it
Thank you so much, that was very helpful. I studied it and could see the relationships much better. I was actually able to progress, surprising myself. I’m still short of what I need to make it work. see the attached if you care to still help on this one, otherwise thank you. dragAndDropHypeStyle2.hype.zip (53.9 KB)
hm, the code you’ve added is senseless … it just creates a boolean resulting in false within the code, but this boolean is not integrated in any functional flow …
why not work as described in my post above?
set a data-attribute to the drop-element:
data-drop -> expectedtimelinename
then receive with:
const myTimelineName = hitCheck.element.dataset.drop
then run the timeline …