Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
Sign in to follow this  
Charlest93

Hover text / grayscale

Question

Site URL: https://bumblebee-drum-w3fz.squarespace.com/interiordesign

hi,

I used the tutorial from Brandon for the hover effects: 

 

Everything is perfect, except the hover effect. I have an opacity effect and I would like grayscale 100% .

I have this CSS: 

figure.gallery-grid-item.has-clickthrough:hover img {
    filter: grayscale (100%);
  }

But it is not working.

I also tried:

.gallery-grid-item img:hover{filter:grayscale(100%)}

 

Can you help me ?

Thank you !

 

 

Share this post


Link to post

2 answers to this question

Recommended Posts

  • 0

I'm guessing the Javascript for the captions is interfering. I just did this on a brand new page with the sample gallery and it works fine to turn them gray on hover.

.gallery-grid-item img:hover {
  filter:grayscale(100%);
}

 


Creating websites using Squarespace at Design by Donuts 🍩

Share this post


Link to post
  • 0

yes I know @ChrisBartow because it was working before the tutorial. (just the grayscale without the text hover). 

 

And I also have an other problem: now I am not able to go to the image link when I click on it.

Share this post


Link to post

Create an account or sign in to comment

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

Sign in to follow this  

×
×
  • Create New...