Tagged: caption
Hello! I wasn’t able to find anything with instructions for updating this. Can you please help me update a few things on the captions for a masonry gallery.
1. Change the caption animation from the Flip X to a Fade In Up.
2. Remove the arrow
3. Add 1px in width to remove the extra space shown in the image below.
Thank you for your help!
Hey Rachel,
Could you post a link to the site in question so that we can take a closer look please?
Regards,
Rikard
Here is a link, site is WIP for now, thanks!
http://chrisgallop.com/blog/#work
Hi,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
.av-inner-masonry .avia-arrow {
display: none !important;
}
.av-caption-on-hover .av-masonry-item-with-image .av-inner-masonry-content {
opacity: 0;
filter: alpha(opacity=0)!important;
}
.av-masonry-entry.av-masonry-item-with-image .av-inner-masonry-content {
-webkit-transform: rotateX(0deg)!important;
transform: rotateX(0deg)!important;
}
Best regards,
Vinay
Almost there, but you can still see the width is 1px too small. How can I increase the width?
Hi,
Please change the last block of code to :
.av-masonry-entry.av-masonry-item-with-image .av-inner-masonry-content {
-webkit-transform: rotateX(0deg)!important;
transform: rotateX(0deg)!important;
width: calc(100% + 1px);
}
Best regards,
Vinay
Worked perfectly! Thank you!