Site logo

[Resolved] Small hover problem on iphone

Home Forums Support [Resolved] Small hover problem on iphone

Home Forums Support Small hover problem on iphone

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #2523936
    Hernan

    Hello, I have a problem only with iphones. It turns out that in my home I have several containers with a hover effect (decorative only). On android devices it behaves well but on iphone sometimes double tap is required

    I am aware that I shouldn’t really use :hover effect on mobile devices but :active works much worse, no transitions can be applied and the result is very jerky. Is there an alternative path? Could you consider checking for future versions of the theme? I think that eventually this could happen to more people

    Thank you !

    Kind regards !

    #2524209
    David
    Staff
    Customer Support

    Hi there,

    that content isn’t added by the Theme, it looks like its from Toolset ?
    So you would need to address that issue with that plugin developer…. which leads to the bigger picture.

    There are two main options here:

    1. DO NOT apply those hover effects on tap devices. The developer can wrap the styles in @media queries to control that.

    2. Use a Javascript library to handle hover/tap events on mobile. But this is a nightmare, as apart from configuring for each purpose it will take a lot of maintenance to make sure it works on all current and future tap devices.

    Option 1 makes the most sense in these scenarios.

    #2524356
    Hernan

    Thank you very much, I will meditate on option 1

    It is correct, they are Toolset containers, although a few months ago I did some tests with other themes and the hover effect worked on iPhones (same scenario, toolset containers). But those other themes had horrible integration with bbpress (plus GeneratePress is lighter and has excellent support =), of course )

    For now I think that with @media I can target only iphone and remove hover only them. I will investigate this path

    Thanks

    #2524478
    David
    Staff
    Customer Support

    You’re welcome

    #2524807
    Hernan

    I found a solution!

    To the image that is displayed when hover is applied I added the following property:

    pointer-events: none;

    Now the hover effect works fine on both android and iphone. Although of course the image now would not show title when the cursor is hovered (which is often also desirable)

    #2525672
    David
    Staff
    Customer Support

    Glad to hear you found a solution 🙂

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.