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

Removing Overlay on 7.1 Portfolio Hover Background


a-ryann

Question

Site URL: https://scaacquisition2020.com

pw:1234

This is making me nuts. I need to remove the image overlay that appears when you hover over the portfolio links on my homepage. There is no setting within the design color editor and I've set all "image overlays" to transparent just to be safe but still can't figure out what the CSS should be to remove this annoying default setting.  

Screen Shot 2020-04-29 at 5.21.37 PM.png

 

EDIT: 

Here is the correct CSS for anyone interested

 

.portfolio-hover-bg-overlay {
  display: none
}

Edited by a-ryann
Found the answer!
Link to comment
  • Answers 24
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Posted Images

24 answers to this question

Recommended Posts

  • 0
3 hours ago, evelynmarinap said:

Hi Tuanphan, I am trying to to get a product image to appear without a hover. 

Similarly to a-ryann's post, the above code removes the image all together. 

I wish for there to be no hover. 

.portfolio-hover-bg-overlay {
  display: none
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
10 hours ago, sjet said:

Me too. Neither of these code snippets works:

NEITHER

.portfolio-hover-bg-OVERLAY {
  display: none
}

NOR

.portfolio-hover-bg-MASK {
  display: none
}

 

try

.portfolio-hover-bg-overlay {
  display: none !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 9/21/2020 at 6:34 PM, expatinzurich said:

Hi, Do you mind sharing how you solved the issue? I'm trying to do the same thing. Thanks.

If you share link to portfolio page, we can help

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 1/14/2021 at 12:10 AM, niketatripp said:

Hello @tuanphan

Do you know how I can get rid of the overlay here https://studioiris.squarespace.com/projects

Thanks!

Add to Design > Custom CSS

.portfolio-hover-bg {
    opacity: 0 !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 2/23/2021 at 9:01 AM, zerosite said:

@tuanphan hello, I see you are a squarespace ultra expert. 

I need to add a background image in the portfolio page, where I am using a gallery section , is that possible ?

Im not sure if its a squarespace bug, but natively apparently there isnt a way,

Many thanks and keep up the amazing work. 

Thanks 

Hi. Can you share link to page? We can check easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
3 minutes ago, GFN99 said:

Hello! 

Hey guys, is there a way to remove the grey overlay before and during the hovering? I want it to be bright white and have the feeling that people are clicking on my handwriting!  

 

https://www.grahamnielsen.com/work 

 

Ok using the first CSS in this thread I have the overlay removed WHILE hovering and still maintained the ability to change background image. However, I want the overlay before the hovering begins to also be removed. Can anyone help me out?

Link to comment
  • 0
On 4/13/2022 at 9:03 AM, GFN99 said:

Ok using the first CSS in this thread I have the overlay removed WHILE hovering and still maintained the ability to change background image. However, I want the overlay before the hovering begins to also be removed. Can anyone help me out?

It looks like you solved this?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 4/18/2022 at 5:39 AM, tuanphan said:

It looks like you solved this?

I resolved it slightly by selecting "keep last selection" when editing the portfolio, but when you load the page it still shows up as grey for a second and then turns white. Is there any CSS that I can use to remove the grey overlay completely so that I do not have to use "keep last selected"? Thanks

Link to comment
  • 0
On 4/18/2022 at 5:39 AM, tuanphan said:

It looks like you solved this?

Hi @tuanphan! Thanks for your help on this topic. When I use the code below the image that's supposed to be featured in the portfolio hover effect disappears altogether. Do you have any other suggestions of selectors? I'm using the portfolio hover follow cursor settings for reference!

.portfolio-hover-bg {
    opacity: 0 !important;
}

 

Link to comment
  • 0
On 5/14/2022 at 1:51 AM, hannahkruegerstudio said:

Hi @tuanphan! Thanks for your help on this topic. When I use the code below the image that's supposed to be featured in the portfolio hover effect disappears altogether. Do you have any other suggestions of selectors? I'm using the portfolio hover follow cursor settings for reference!

.portfolio-hover-bg {
    opacity: 0 !important;
}

 

Can you share link to portfolio page? We will check it again

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 5/19/2022 at 2:04 AM, hannahkruegerstudio said:

Hey! Thank you so much. Here's the URL: jhmcreativeco.squarespace.com/. Password: jhm

Which page are you referring to? I Don't see on homepage/portfolio page

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

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


×
×
  • Create New...