Button ":hover" state issues on touch screen displays/multi-page presentation

  • 1
  • Question
  • Updated 3 years ago
  • Answered
As many of you already know, button's ":hover" state gets "stuck" on touchscreen displays until you click something else. This would not be a big deal, but here is my situation. I am using the script to reset the jquery page to the "home" div (not the entire page, just the part of it) after some user inactivity time. This, however, does not reset navigation buttons located in the different section of the document, which creates this mismatching between content displayed and navigation.
I could redesign the entire document and put content together with navigation. I also could remove animation from buttons. I could add another HTML document, sort of intro page or something. Finally, I could reset the entire document, but those are the options I would like to stay away from.
What I am looking is some examples of nice button animations that would work on touch screens. Basically all I need is button to visually respond to a click and then go to the initial state.
I already tried ":active" state, but it was simply ignored by our touch screen and there were no changes happening.
I am wondering if some of you successfully solved this problem and could share with me/us how to deal with this problem. I am looking for an elegant and light-weight solution/workaround as the page is already getting too complicated for a digital directory.

Preview:http://preview.risevision.com/Viewer.html?type=presentation&id=00237c9a-bdaf-43ce-858d-57a588c8d...

The buttons are working fine with mouse, but ":hover" gets stuck on touch.
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb
  • looking for a genius advice

Posted 3 years ago

  • 1
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb
Note : it can be slow on loading because at times my cheap-@$$ hosting sometimes does that.
Photo of Robb

Robb, Official Rep

  • 76,676 Points 50k badge 2x thumb
Darius,

Is any of the information here helpful?: https://help.risevision.com/developer/presentations/multi-page/building
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb
Robb,

Not really. I actually made a multi-page presentation based on that information, but it went out of the window rather fast :) The problem with it is that it just looks plain and not very attractive. The client wants more interesting transitions or other pleasant to interact elements. They do not want to buy simple switching from one page to another anymore; they want cool stuff now :)
Photo of HSuarez

HSuarez

  • 11,896 Points 10k badge 2x thumb
Hi Darius,
If you are looking for interesting transitions and effects, maybe frameworks like Sequence might be of interest: https://github.com/IanLunn/Sequence - also see http://codepen.io/IanLunn/pen/Gimja
(Edited)
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb
Thank you, I will take a look at it.