Related Items

[bigbangthinking]

Hi

I have the related items working, but think its a little t¿bit ti invasive and would like to make some changes.

1.- Make the thumbnails 50% it’s size

2.- Make the circle arrow 50% it’s size

3.-Make the transparent wight background on roll over, cover the whole image

4.- Make the rollover text gray.

Thanks

Gonzalo

http://www.bigbangthinking.com/?portfolio=unlimited-jeans-shop

[Kyle – SUPPORT]

Hi

Add this to your custom css

figure.animated-overlay:hover figcaption {
  transform: translate(0);
}
figcaption .thumb-info i {
  font-size: 17px;
  height: 16px;
  line-height: 23px;
  margin-left: -16px;
  width: 16px;
}
figure.animated-overlay figcaption .thumb-info h4, figure.animated-overlay figcaption .thumb-info h5, figcaption .thumb-info-excerpt p {
  color: #555555!important;
}

Unfortunately you can’t reduce the size of the related items as they are hardcoded

– Kyle

[bigbangthinking]

Kyle

I can live with the oversized thumbnails. Thanks.

The code changed the text color, but the background is still animated and displaced.

🙂 G

[Kyle – SUPPORT]

Try adding important to the

figure.animated-overlay:hover figcaption {
  transform: translate(0)!important;
}

– Kyle

[bigbangthinking]

Now it works in Firefox, Explorer but not in chrome

🙂

[Kyle – SUPPORT]

Ahh sorry,

figure.animated-overlay:hover figcaption {
  transform: translate(0)!important;
  -moz-transform: translate(0)!important;
  -webkit-transform: translate(0)!important;
}

Always forget the others!

– Kyle

[bigbangthinking]

AS usuall the support here is suberb.

Thansk it works great now.

[Mohammad – SUPPORT]

Hi,
You most welcome. I’m glad that issue resolved. Thanks Kyle :-).
With Best Regards
Swift Ideas