Create a Lightening Hover Effect on Photos - Blogger

You may have noticed that when you hover on photos on my blog they lighten. It is a nifty little effect that can really make your photos stand out. knew of course about hover effect on photos but never implemented it until I saw it on Miss Drifted Snow White's fab, well designed blog. Go check it out, I love her blog and she is an utter blog design geek like moi.

So now let us get on how to do it.

Navigate to Dashboard>Template>Customise>Advanced>Add CSS.

Copy the following code and paste it into the 'add css' box.

.post-body img:hover {
opacity: 0.5;
filter: alpha(opacity=50);
border: none;
}.post table.tr-caption-container img:hover {
opacity: 0.5;
filter: alpha(opacity=50);
border: none;
}

 

Click on 'apply to blog'.

That is all there is to it. But be aware that this hover effect won't work in IE because IE is an antiquated and rather rubbish browser. If your still using IE I advise you to switch to firefox or chrome.