Is this correct?

Question

img{
filter:grayscale (100%);
}

img:hover{
filter: saturate(100%);
transition: 1s;
}

But it doesn’t work as I want. I want that when mouse is over the image, it changes its saturation in a second transition. Help please!! Thanks in advance!

Answer 1

You should add at img transition:filter 1s;

Answer 2

Don’t worry I have just solved it, the problem was that i write saturate (100%) and I had to write grayscale(0%) then it worked!!

Answer 3

Sorry but why u ise saturate, use the same grayscale but with less prpcentage for example 0%.

Answer 4

george that is what I wrote 🙂

Answer 5

Tomás Atrat yes i found your answer after writing my, it is difficult to read posts via phone)

Answer 6

Master Genius I tried that before I could solve it, but the transition happens when the page loads, not when the mouse is over... thank you!!

Answer 7

I don't get what does second transition means

Answer 8

george do not worry at all!

Answer 9

Your transition 1s; property should be in img{}

Answer 10

Abhay sorry i didn’t explain it well, I mean a the duration of the transition (1s)

Answer 11

💜 Alex Tușinean 🍇 I have already tried it but it doesn’t work 😕

Answer 12

Tomás Atrat use grayscale(0%)