Here is what I’d like to do - I have a black and white image and I want to have the color version of the image show on hover. I saw a similar topic from a year ago and it looked as if the end result was that it didn’t work - and that was for a linked image.
Here is what I have tried so far…
- Created section - created container - added 4 columns - put a div block inside each column - in there is an H2 title and an image below…(all have classes)
- Placed my black and white image in as the image, with the color version as the background - making the black/white one 0% opacity on hover - this makes both 0% so that’s out.
In the hover state, you can’t add a different image - you can only replace the image that is already there, replacing it in the pre-hover state as well.
I saw a video on placing a colored text box in to show on hover - and they add a div block on top of the other one. I played around with that and when I added the second image, it pushed it around so that one was visually on top of another - so 2 rows of images, not one on top of the other so you’d see 1 row.
The second problem I am having is that I cannot get rid of the grey placeholder block that is there now - placeholder.svg. How do I get rid of that? Even IF I put the background in as the color image, this dumb grey block is covering it up - there is no little trash can next to that sucker to get rid of it. If I delete, it deletes the whole image.
All help appreciated. I watched many of the videos - all of the beginner ones and probably half of the “here’s how we created webflow” and a few of the others as well. They’re great, but not helpful so far - a link to one that would show this would be fine.
Thanks in advance!