Thumbnail Customisation

17 hours ago, zoltar451 said:

Site URL: http://www.jules-hunt.com

Hello

Can anyone help me smooth out the transitions on my thumbnails, so they don't flicker as you move the cursor off the thumbnail?

They appear to blink as the cursor moves off the title and it flicks back to the thumbnail, whereas I'd like a smoother transition.

I am using the Kester template.

Thanks

You could try to replace your current custom css with this

.tweak-portfolio-grid-overlay-show-text-after-hover .portfolio-grid-overlay .grid-item .portfolio-text, .tweak-portfolio-grid-overlay-show-text-after-hover .portfolio-grid-overlay .grid-item .portfolio-overlay {
  opacity: 0;
}
.tweak-portfolio-grid-overlay-show-text-after-hover .portfolio-grid-overlay .grid-item:hover .portfolio-overlay, {
  opacity: 1;
}
.portfolio-grid-overlay .grid-item .portfolio-overlay {
    transition: background-color 200ms, opacity 200ms ease-in-out;
}
.grid-item[href*="lmon"] .portfolio-overlay {
    background: orange
}

.grid-item[href*="primevideo"] .portfolio-overlay {
    background: red
}

.grid-item[href*="brossbennett"] .portfolio-overlay {
    background: #20b2aa
}

.grid-item[href*="betfair"] .portfolio-overlay {
    background: gold
}

.grid-item[href*="guardian"] .portfolio-overlay {
    background: pink
}

.grid-item[href*="nikerunning"] .portfolio-overlay {
    background: #f0f
}

.grid-item[href*="crystal-fighters"] .portfolio-overlay {
    background: #228b22
}

.grid-item[href*="sapientnitro"] .portfolio-overlay {
    background: #f5f5f5
}

.grid-item[href*="roberts"] .portfolio-overlay {
    background: #2e8b57
}