Jump to content

Is there a way to darken the opacity when I hover over images?

Recommended Posts

Trying to darken the opacity when I hover over images on my portfolio site. Currently the opacity is too light and my title text doesn’t mesh well with my images. (See attached screenshot - Drew League example). Possible to do so? Any help is much appreciated!

F3259413-D3BC-455A-A25B-4D8BF917F469.png

Link to comment
  • Replies 9
  • Created
  • Last Reply

 

This code works in other places, summaries, thumbnails. Just in case you need it at some point. 

.img.thumb-image:hover {
         opacity: 0.6;
           filter:alpha(opacity=60);  //For IE8 and earlier 
     } 
         
  .image-slide-anchor:hover {
         opacity: 0.6;
           filter:alpha(opacity=60);  //For IE8 and earlier
    }
 

Link to comment
  • 10 months later...
On 5/9/2020 at 7:07 PM, derricksrandomviews said:

 

This code works in other places, summaries, thumbnails. Just in case you need it at some point. 

.img.thumb-image:hover {
         opacity: 0.6;
           filter:alpha(opacity=60);  //For IE8 and earlier 
     } 
         
  .image-slide-anchor:hover {
         opacity: 0.6;
           filter:alpha(opacity=60);  //For IE8 and earlier
    }
 

But how do I apply it in a simple inline image block

Link to comment
1 hour ago, derricksrandomviews said:

 To change a single image block, you need the block id, if it isn't the only image on a single page. If it is you put the code in a code block on the page or in the page advanced header in page settings. That  second option takes a business plan to do. 

I only want to apply it in this group of images.

 

image.thumb.png.d2717b3bef7cf431d1b100d3de67957e.png

this is the code that I was trying 

img.thumb-image.loaded{
         opacity: 0.6;
           filter:alpha(opacity=60);  //For IE8 and earlier 
     } 
         
   img.thumb-image.loaded:hover {
         opacity: 0.6;
           filter:alpha(opacity=60);  //For IE8 and earlier
    }
 

my website is : https://manatee-azalea-la3y.squarespace.com/

pass: 123456

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.