Pidding Posted May 5, 2020 Share Posted May 5, 2020 Hi, I have a hyperlinked image block where I'd like for the below to happen upon hover: - Text to appear over the image - White opacity over image I've managed to get this to work using the below CSS code however it seems to have messed up the image clickthrough function. I believe the problem is specifically with the white opacity over image which seems to be disabling clickthrough function. Help! Here's the code I'm using... p, h1, h2, h3 { -webkit-hyphens: manual !important; -moz-hyphens: manual !important; -ms-hyphens: manual !important; hyphens: manual !important; } .design-layout-poster .image-card-wrapper { visibility: hidden; opacity: zero; } .design-layout-poster:hover .image-card-wrapper { visibility: visible; opacity: 1; } .image-block .image-linked:before { content: "";width: 100%;height: 100%;position: absolute;z-index: 1;top: 0;left: 0; opacity: .6;background:; } .image-block .image-linked:hover:before {background: white;opacity: .3;transition: all .2s ease-in-out; } Link to comment
tuanphan Posted May 6, 2020 Share Posted May 6, 2020 Can you share link to page where you use image block? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.