Hover does not work on mobile and tablet

vantrinh duong

• August 13, 2022 12:51

I have a feature block with columns containing images and text. I want on mouse hover the image is overlaid with color. (content is highlighted on colored background). Hover works for desktop but not for tablets and phones. Why do you block the hover function on tablets, phones. I want them to work for both tablets and phones.

0

• 

  KC George

  • August 15, 2022 05:58
  • Edited

  Hi Vantrinh,

  Can you elaborate your question? How do you propose to use the hover function on a mobile or a tablet? Do you use a mouse pointer on a tablet or mobile? Do you have another device you use to hover over page elements?

     

  0
• 

  vantrinh duong

  • August 16, 2022 08:37

  Hover works well in CSS3 for touch devices (tablets and phones), When touching the object the hover effect is similar to hovering the mouse.

  0
• 

  KC George

  • August 16, 2022 14:39

  Hi Vantrinh,

  Do you have a reference website where you touch on a page element on a mobile screen and the background color changes to a hover color? We would like to take a look at it.

  0
• 

  vantrinh duong

  • August 17, 2022 07:40

  

  https://www.webcode24h.com/

   

  You can see, when I hover the mouse or select the object on the touch screen. The image with a dark color layer to highlight the text content.

   

  0
• 

  KC George

  • August 17, 2022 09:10

  Hi Vantrinh,

  Looks like you have already implemented this in your agency website. May be you should tell us how you did it.

  0
• 

  vantrinh duong

  • August 17, 2022 20:51

  I don't understand why you guys don't allow color overlay on screen sizes smaller than 991px.
  I found this css code @media screen (min-width: 991px) { .nameclass:hover {....}}
  Just remove the "min-width: 991px" to allow it to apply to all different screen width.
  In my example I added custom css.

  0
• 

  vantrinh duong

  • August 17, 2022 20:57

  When touches the object on the touch screen. The result is similar to hovering the mouse on the desktop.

  0

Please sign in to leave a comment.