E-commerce website
Please how can I make this type of color when hovering on this image?
34 Replies
is that a live site you can link ?
No,,I’m still working on it.
so what do you mean "this type of color" ?
I meant,what do I do to make that happen when hovering on the image.
make what happen
the border ?
I’ve done the border already,I mean the background thats on the image when hovering.
how can you tell there is a "background on the image" ? what happens exactly when you hover ?
This is the normal state.
ok so it gets brighter
It’s brighter on the normal state.
to set hover styles you use the hover pseudoclass: https://developer.mozilla.org/en-US/docs/Web/CSS/:hover
to make it brighter you could do something like opacity https://codepen.io/Xe11o/pen/BavyxZa
could also do
filter: brightness(150%); or some othe other techniques here https://stackoverflow.com/questions/16178382/css-lighten-an-element-on-hoverI’m not trying to make it brighter.
You need to explain what you're trying to do. We can't see much since it's low quality image taken by phone. Maybe send a screenshot? If you're on Win10 you can use Ctrl+Shift+S to use snipping tool.
All I can see is it gets border and it gets brighter. You already added border and you're not trying to make it brighter. What are you trying to achieve?
Okay
This is the image at normal state.
And this is the image when you hover on it.
@nwankwojoseph_ you can do it with a pseudo element- https://codepen.io/deerCabin/pen/YzdPvwz
You’re valid ✅ ….thanks 🙏☺️
no worries, added your border thing too.
I made use of outline not border. I
that's what i did.
Okay.thanks once again man🤝
no problem 🤝
I don’t know how to change the tag 🤦♂️
there may be a better way of doing it but that's what came to mind, perhaps someone else who comes along that has a better solution can improve it.
Okay bro 🤝
what tag?
Click three dots on top-right, should be option to edit them there
Can’t find any dot. 😢
its not showing
You have to hold on the topic in the channel list on mobile. I've added the solved tag for you now
thanks..done