uio504 Posted October 24, 2019 Share Posted October 24, 2019 Hi, I'm using the Avenue template and would like to have the Index thumbnail images change from a black and white image to a color image when you hover over them. Does anyone know the code to do this? I appreciate your help! Link to comment
JeremySnell Posted March 30, 2020 Share Posted March 30, 2020 Also would love help with this! Link to comment
tuanphan Posted March 30, 2020 Share Posted March 30, 2020 On 10/25/2019 at 3:59 AM, uio504 said: Hi, I'm using the Avenue template and would like to have the Index thumbnail images change from a black and white image to a color image when you hover over them. Does anyone know the code to do this? I appreciate your help! 2 hours ago, JeremySnell said: Also would love help with this! You can try CSS. If you share link to your site, I can take a look 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
camilla.ciappina Posted May 14, 2020 Share Posted May 14, 2020 Hey! i am using Avenue too and wanted to do the same as the requested above. How can I do that please? I want the pepsi logo to become the colored version when hover the mouse. https://flugelhorn-oarfish-d3cj.squarespace.com/ password: Marcus thank you! Link to comment
tuanphan Posted May 14, 2020 Share Posted May 14, 2020 43 minutes ago, camilla.ciappina said: Hey! i am using Avenue too and wanted to do the same as the requested above. How can I do that please? I want the pepsi logo to become the colored version when hover the mouse. https://flugelhorn-oarfish-d3cj.squarespace.com/ password: Marcus thank you! First, add a colored pepsi logo, then share link again, I can give the code. 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
camilla.ciappina Posted May 14, 2020 Share Posted May 14, 2020 Just did it. But i want it to go from off-white to colored logo. Not the way around. Is that possible? thank you! Link to comment
derricksrandomviews Posted May 14, 2020 Share Posted May 14, 2020 I know about this code but it wll need your own element id (that long number): body#collection-563bea6ae4b0ccc59db69084 img { -webkit-filter: grayscale(100%); filter: grayscale(100%); } body#collection-563bea6ae4b0ccc59db69084 img:hover { -webkit-filter: none; filter: none; } This site has quite a few hover tricks and how to do them: https://www.mybilliedesigns.com/blog/squarespace-customization-html-hover-effect Link to comment
tuanphan Posted May 14, 2020 Share Posted May 14, 2020 25 minutes ago, camilla.ciappina said: Just did it. But i want it to go from off-white to colored logo. Not the way around. Is that possible? thank you! Try this CSS a.project img { filter: grayscale(1); } a.project:hover img { filter: grayscale(0); } 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.