Need to touch a category twice in "Product categories" for Visual Composer

Hello

In “Product categories” element for Visual Composer, when you choose “Center title” as a Categories design, then on mobile device users have to touch a category twice before the link opens.
This is not the case for other Categories designs (Default and Alternative). All Categories designs seem to have some “on hover” effect, but “Center title” design offers a poor user experience on mobile device…
Certainly this can be improved 😉

Regards

Hi,

Could you please provide us a link where we can see this problem on your website?

Regards

Hello

Site is not live yet, but you can check on the test site whose access is provided in the “Private Content” area.
With a touch enabled device, just touch a category…

Try to add the following code snippet to the Custom CSS area for mobile and tablet devices in Theme Settings to fix this issue.

.cat-design-center .hover-mask>a {
	opacity: 1;
  	visibility: visible;
}

.cat-design-center .hover-mask {
	-webkit-transform: translateY(-15px);
    -moz-transform: translateY(-15px);
    -o-transform: translateY(-15px);
    transform: translateY(-15px);
}

.cat-design-center:hover .product-category-thumbnail {
  opacity: 0.9;
}

Regards

Well, this is not exactly what I expected. Nowadays, a site should work on any touch screen, whatever is the size (e.g. laptop with touch screen, I’ve got one 😉

Default and Alternative Categories designs just work fine, that is:
1- With a mouse, you have the hover effect and then when you click the link is followed
2- With a touch screen, when you touch, you have the hover effect and link is followed

As compared to this, “Center title” Categories design has the following behavior:
1- Same
2- With a touch screen, when you touch, you have the hover effect. For the link to be followed, you need to touch again.

Sorry, but this categories design can’t work in the way it works on other ones. Hover effect on touch blocks the link and the only one solution for that is to disable hover effect. In this case, it would be absolutely adapted to touch devices 🙂

Oh I see… Then I will choose another Categories design and tweak it to make it look close to “Center title” design, as this is the one I like the most 😉

Thanks for the explanation.

You are welcome.

[Author]

Posts