Comments on: background-blend-mode https://css-tricks.com Tips, Tricks, and Techniques on using Cascading Style Sheets. Thu, 20 May 2021 16:34:31 +0000 hourly 1 https://wordpress.org/?v=6.6.1 By: Marcus https://css-tricks.com/almanac/properties/b/background-blend-mode/#comment-1604984 Tue, 15 Nov 2016 17:36:36 +0000 http://css-tricks.com/?page_id=199429#comment-1604984 In reply to Rene.

I found the only and best working solution by Matt Slack:
http://collectiveidea.com/blog/archives/2016/06/02/fun-with-svg-css-background-blend-mode-fallback

I didn’t use the java script part (beside the feature detection) since I was able to included the image path directly into the svg via my cms template

<feImage xlink:href="http://path.to/image.jpg" ... />

The only thing that took some time to figure out was the usage of the <base href=""> which interferes with the filter="url(#myFilter)" attribute. In those cases I had to add the path to the current page filter="url(/mypage.html#myFilter)".

Here is Matt’s js version + <base> tag (http://codepen.io/localhorst/pen/QGEMmE)

]]> By: Rene https://css-tricks.com/almanac/properties/b/background-blend-mode/#comment-1603473 Tue, 16 Aug 2016 07:19:51 +0000 http://css-tricks.com/?page_id=199429#comment-1603473 Is there a way to pull this off in IE?
Or a solution which works in all ie versions? So far I have not found a solution, Microsoft does not want Support the blend-mode. On this way we can not use blend-mode. I have found solutions with javascript, most have trouble with ie 11 and Edge and the color is different in the browser.
Rene

]]> By: Alexander van Aken https://css-tricks.com/almanac/properties/b/background-blend-mode/#comment-1601905 Wed, 01 Jun 2016 09:00:39 +0000 http://css-tricks.com/?page_id=199429#comment-1601905 Is there a way to pull this off in IE?

]]>