Dynamic Hover States

I am working on a drag and drop activity where learners put stars on a grid based on how they wish to rate the items the stars represent.  The learner sees the description of each star when they hover over it - a callout box appears to the star's left.  However, when they drop it on the left side of the grid, the callout box falls off the screen.  How can I set the states such that an item that is dropped on the left side of the grid has the hover state render the callout box on the other side?  (ie 2 hover states that conditionally appear depending on where it's dropped). 

1 Reply
Crystal Horn

Hey Matt!  That's a great challenge to bring up.

Could you create 2 custom hover states (name them something other than Hover, though), and trigger them separately?  

You'll probably need to build out some variables so that you can set conditions on the triggers, i.e. change state of Star to "callout1" when user hovers IF leftgrid (variable) equals True.