Background color + Effect: mix-blend-mode multiply Bug?

[PhilTone]

Hey,

I’ve noticed when I create a div, give it a background color and give that div the mix-blend-mode there’s some kind of “stutter” if I have for example a hover animation on the background-image that’s behind that div.

I will post a link in the secure not for you to see what I mean. The effect is on the “posts” element when you hover over the big news.

Am I doing something wrong here or is that some kind of bug?
The multiply effect works on the first news row - there I placed the mix-blend-mode onto the particle that appears when you hover.

[tristup]

Hi @PhilTone,

Thanks for reaching out.
I have checked and found there is solid color is shown while mouse event fired inside the image. This might be due to the effect applied to it. I would suggest you disable the Color property from the Link Child Interaction.

If that does not help, please provide login credentials for your site in a secure note to examine it further, including:

– WordPress Site URL & Login URL
– WordPress Admin username/password

To create a secure note, click the key icon underneath any of your posts.

Thanks

[PhilTone]

Hey, that didn’t work :-/

I’ve update the secure not with your login credentials. Would be cool if you could take a look.
Thx!

[christian]

Hey @PhilTone,

It’s because of the Image container’s Z Index. It should be set to auto.

Since you can’t use Z Index, you need to re-order the Divs with the Red Div being the last or 2nd Div. See the working example on your page.

Hope that helps.

[PhilTone]

Ok thx, I will check that out.

[prakash_s]

Hello @PhilTone,

Please let us know how it goes.

Thanks