[athieleParticipant]

Hello,

We’ve troubleshooted a variety of things pertaining to the use of CSS blend modes on our site. Background-blend-mode: multiply; for instance. Unfortunately we are having no luck getting it to work anywhere.

[Prasant RaiModerator]

Hello There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thanks.

[athieleParticipant]

Sorry I didn’t include that, it is http://www.giraffixincdesign.com

[JoaoModerator]

Hi There,

As your site has under construction plugin please provide your admin credentials in a private reply,

Also provide more information about your issue.

Thanks

Joao

[athieleParticipant]

This reply has been marked as private.

[athieleParticipant]

This reply has been marked as private.

[FriechModerator]

Hi There,

Thank you for the credentials, but would you mind to clarify your issue about background-blend-mode? It seems working fine on my end?

Maybe your browser does not support background-blend-mode?

Please clarify.

Thanks.

[athieleParticipant]

I see that we can get it to work on the section and it’s background, we would like it to work on images overlaying the background. Is that possible? ie. placing the blend mode into rev slider and images placed into sections

[RupokMember]

Hi there,

Let’s try and see if that works. We are not really sure where and how you are trying to apply this. If you can give us an example then we might suggest something.

Thanks!

[athieleParticipant]

We are trying to get it working in our REV Slider at the top of the home page, we have 2 images overlaying each other.

[FriechModerator]

Hi There,

It is not possible to add multiple background-image on one container, so blend-mode is not possible on two background-image.

Maybe you can make the top layer semi-transparent, but the will make its content semi-transparent as well. Have you try uploading your background-image as .png format and make it semi-transparent before uploading it?

Do you know a website that has this effect, can you share it to us so we can have a better picture of what you’re trying to do.

Thanks.

[athieleParticipant]

Here are a couple sites describing what we want to do that isn’t going to be achieved by using transparency on images.

https://css-tricks.com/almanac/properties/m/mix-blend-mode/

https://dev.opera.com/articles/getting-to-know-css-blend-modes/demo_blendmodes_tile.html

https://css-tricks.com/almanac/properties/b/background-blend-mode/

If we could get the image containers that we place into sections to be transparent and allow us to use a blend mode on the image we place above the section image or color that would be great.

Best explanation would be at 9:04 into this video https://www.youtube.com/watch?v=SjBaL69EgMo

[RupokMember]

Hey there,

Thanks for writing back! Regretfully, this particular customization request is outside the scope of our support as this is not related to an issue with the theme and instead has to do with your customization of it. As such, you will need to investigate this particular issue on your own or seek help from a developer should you not feel comfortable making these changes yourself. If you have any further questions about the theme, we are more than happy to provide you with assistance on these inquiries.

Thank you for your understanding.

[Author]

Posts