Jump to content

Hover over image diabled fore mobile version but not right

Recommended Posts

Hi there

I have disabled the hover effect for the mobile version of my site, but on this page there is an issue. I want the black and white image only to appear. Currently, the colour image first appears and then the black and white image fades in over it.


Can you tell me how to make that colour image not appear at all on mobile? Only for this "about" page, none of the others on the site.


This is the current CSS for this image:

/* Change Image on Hover */

@media screen and (min-width:992px) {
    opacity: 0;
    -webkit-transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out

#block-0caff5f46a51d3dfea13:hover {
    opacity: 1


Thank you.

Edited by RAW
made a correction in the info
Link to comment
  • Replies 3
  • Views 1.3k
  • Created
  • Last Reply

Top Posters In This Topic

Hi. Thanks, that didn't work for me. The mobile issue is still there and it affected the hover on the desktop version too (giving it the same issue as the mobile version).

Link to comment
  • 2 weeks later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.