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

Thumbnail B&W to Colour Rollover


carliemcgarity

Question

  • Answers 6
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Hi @carliemcgarity. Try inserting the following via Custom CSS: .no-touch .collection-5d7a891600952e518d49e751 .project-image { -webkit-filter: grayscale(100%); filter: grayscale(100%); &amp

6 answers to this question

Recommended Posts

  • 0

Hi @carliemcgarity. Try inserting the following via Custom CSS:

.no-touch .collection-5d7a891600952e518d49e751 .project-image {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  &:hover, &:focus {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
  }
}

Let us know how it goes.

-Brandon

If a response helped you out, send a 'Like' 👍 (bottom-right) and/or 'Upvote' vote.jpg.c260784ece77aec852b0e3049c77a607.jpg (top-left)

Link to post
  • 0
On 11/3/2019 at 10:40 AM, brandon said:

Hi Brandon and Carlie,

I am working with the Brine Template and would like to do the same thing - i want thumbnail rollover to transition from b&w to color on hover - I am a beginner with inserting code -- can you make a suggestion?

Thanks!
Liz

 

 

Link to post
  • 0

Hi @Benedetto. The example code is fairly generic. It's simply a matter of changing the selector (in this case ".collection-5d7a891600952e518d49e751 .project-image") to whatever applies to your use-case. One can use browser developer tools / web inspector to locate the collection ID or other selector information, make the adjustment, then add via Custom CSS.

As is often the case, if you need something more specific, it's best to include a link to the page in question, a description of what you want to achieve on the page. If that's the case, consider editing your message above to include that info (rather than posting a new message, which adds to the length of the thread here).

If a response helped you out, send a 'Like' 👍 (bottom-right) and/or 'Upvote' vote.jpg.c260784ece77aec852b0e3049c77a607.jpg (top-left)

Link to post
  • 0
45 minutes ago, Jasm said:

Hi there,

I am using Avenue template and want create black and white to colour rollover thumbnails on the 'Project' page (https://sapphire-wedge-gkn5.squarespace.com/config/design/template). I have looked at a few tutorials, and most mention 'Gallery Styles' for image grids under Site Styles. But this option does not appear in Avenue.

I would really appreciate some help.

Thank you 🙂

Figured it out. All good. 🙂

Link to post

Create an account or sign in to comment

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


×
×
  • Create New...