Display slide after Drag and Drop Interaction

So, Im sure it can be done, however, I have no idea how to do it.   In summary, I'd like the user to click an image, a lightbox comes up with content.  Then they will close the lightbox and then drag the image to the correct category.  If it is dropped in the right category, I would liike a slide to display with content .

Here's a screencast.


Thanks for your help in advance.

7 Replies
Christine Hendrickson

Hi there Jeanette!

How about using layers instead of lightboxes for all of those objects? I think this would be a little easier to work with, personally.

What you could do is work with states and layers instead of lightboxes. Have an initial state of the object as "Normal" and change the state of the character to a custom state, once the layer has been closed. 

Here's a quick example:

Layer Example for Jeanette

Now, you don't need to change the appearance of the object with the state, I did this in the example simply so you could see that the state change takes place once the layer has been closed.

This way you can work with simple states and conditions, rather than variables and lightboxes. As you can see, you can even have them appear similar to lightboxes, but working with this type of effect is a little easier and quicker :D

I'm attaching the example file, just in case you want to take a closer look at the conditions I used, etc.

If you have any questions or trouble with this, just let me know!


Christine Hendrickson

Hi there Jeanette!

No problem - I think I see what's happening. As I mentioned earlier you'll want to change the object to a custom state. The "Visited" state change may not work so well for this. 

For example, I duplicated Sabrina's "Visited" state and created a new one called "InitiallayerVisited". I triggered this state change on the "X" that closes the first layer (make sure you move this trigger to the top, over the hide layer trigger). 

This seems to be working :) Can you try it out?