Mouse over trigger not working on mobile devices

May 30, 2019

Hi!

I'm building a course that starts with a slide where the users can choose the language they prefer. The buttons display and function perfectly when played on a computer, but if I open the course on my smartphone, it will not open the layer with the button animation when I tap on it (it does play the animation if I keep my finger on the button - but only that, I can't move further).

I have attached the .story file and here's the Review link:

https://360.articulate.com/review/content/7cc22edc-a6f3-4052-b405-0f879cb3c700/review

7 Replies
Michael Anderson

Hopefully support can jump in with a better solution here.

I tried removing the hover trigger from one of your buttons, and you're right, it works without the hover trigger but not with both the hover and click triggers on the button. I'm not sure if this is by design or not.

I removed the hover trigger from the English button as a test, and then on the English layer I set the Jump trigger to 0.5s to give the animation time to finish. I'm not sure if this gets you any closer to what you're trying to do. Take a look at the attached project.

The only other workaround I can think of is to detect the user's device (desktop or mobile), set that as a variable, and have the triggers depend on that variable.

Olga Anishchenkova

Thanks Michael, I hadn't thought of using the jump to slide trigger based on timeline! This does the job perfectly for me.

It would still be interesting to see if anyone had encountered this issue with hover states on mobile devices and could help solve it in a different way.

Crystal Horn

Hi there, and thanks for the help, Michael!

While the Hover trigger is activated by long-pressing on the slide object, the click trigger won't be able to fire. Michael's idea to use a click trigger instead, paired with a trigger to hide the layer after animation, would be the best way to handle this interaction consistently across mobile and desktop browsers.