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

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


MikeDidIt

Question

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

Edited by MikeDidIt
Link to post
  • Answers 9
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Add to Home > Design > Custom CSS .grid-item:hover .portfolio-overlay { opacity: 0.75 !important; }  

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 IE

Exactly what I needed - thanks!

Posted Images

9 answers to this question

Recommended Posts

  • 0
4 minutes ago, MikeDidIt said:

Sure thing its http://www.mikedidit.com on the main home page.

Thanks

Add to Home > Design > Custom CSS

.grid-item:hover .portfolio-overlay {
    opacity: 0.75 !important;
}

 

Link to post
  • 0

 

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
    }
 

Edited by derricksrandomviews
Link to post
  • 0
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 post
  • 0

 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. 

Link to post
  • 0
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 post

Create an account or sign in to comment

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


×
×
  • Create New...