maggierae Posted August 20, 2020 Share Posted August 20, 2020 Site URL: https://www.maggiebrz.design/work Hi all, 1. I altered the hover state on my images to span the full image instead of just appear as a bar along the bottom. However, now it won't clickthrough! Anyone have tips? This is the code I'm using (i'm a rookie). 2. It would be super cool to change the hover color, but that's a lot of asks... .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay .image-caption-wrapper p, .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay-hover .image-caption-wrapper p { position: relative; margin: 0; position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: white; font-weight: 800; font-size: 1.5rem; text-align:center; } .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay .image-caption-wrapper, .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay-hover .image-caption-wrapper { position: absolute; top: 0px; padding: 20px; } .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay-hover:hover .image-caption-wrapper, .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay-hover :focus+.image-caption-wrapper { max-height: 100%; opacity: 1; visibility: visible; } .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay .image-caption-wrapper, .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay-hover .image-caption-wrapper { background: #d78033; opacity:20%; } Thanks! Maggie Link to comment
tuanphan Posted August 21, 2020 Share Posted August 21, 2020 Add to Work Page Settings > Advanced > Header <style> /* Enable click */ figcaption { pointer-events: none; } </style> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.