rp7 Posted June 21, 2022 Share Posted June 21, 2022 Hi, how do I add a code to a portfolio layout page for the grid images to be black and white and for each to appear in colour only when hovered over after 2 seconds or so? I have tried adding codes to the specific pages advanced section but it just appears as text in the header and nothing changes. Please help! Link to comment
tuanphan Posted June 22, 2022 Share Posted June 22, 2022 Hi, You want Initial: Image in Black color, No text Hover: Image in Full Color, No text Is this right? 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
rp7 Posted June 22, 2022 Author Share Posted June 22, 2022 Can you actually let me know in the instance of this also please! Would like to try both Initial: Image in Black color, No text Hover: Image in Full Color, with text Link to comment
tuanphan Posted June 22, 2022 Share Posted June 22, 2022 2 hours ago, rp7 said: Can you actually let me know in the instance of this also please! Would like to try both Initial: Image in Black color, No text Hover: Image in Full Color, with text What is your site url? We can check easier 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
rp7 Posted June 22, 2022 Author Share Posted June 22, 2022 https://www.aleeyadesignstudio.com/work Link to comment
tuanphan Posted June 23, 2022 Share Posted June 23, 2022 On 6/22/2022 at 4:51 PM, rp7 said: https://www.aleeyadesignstudio.com/work To achieve this, you need to use original is fullcolor, then we will use code to invert its color with this code a.grid-item img { filter: grayscale(1); -webkit-filter: grayscale(1); } a.grid-item:hover img { filter: grayscale(0); -webkit-filter: grayscale(0); } .portfolio-grid-overlay .grid-item:hover .portfolio-title { display: block !important; } 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
Create an account or sign in to comment
You need to be a member in order to leave a comment