Re: Intent to prototype: cross-fade

[Zeke Medley]

Webkit and Chromium have bugs tracking the issue but it is hard to discern
from them what their plans are (Webkit
, Chromium

).

On Tue, Jul 14, 2020 at 3:18 PM Jeff Muizelaar 
wrote:

> Have other browsers expressed an interest in implementing the new syntax?
>
> On Tue, Jul 14, 2020 at 6:15 PM Zeke Medley  wrote:
> >
> > Summary:
> >
> > cross-fade is a CSS function part of the CSS Image Module Level 4.
> > cross-fade allows for the blending of multiple CSS images with varying
> > opacities. For example:
> >
> > cross-fade(url(“foo.jpg”) 50%,
> >
> >radial-gradient(circle, transparent 50%, black 150%) 50%);
> >
> > might be used to add a vignette effect to an image.
> >
> > Bug link: https://bugzilla.mozilla.org/show_bug.cgi?id=546052
> >
> > Standard: https://drafts.csswg.org/css-images-4/#cross-fade-function
> >
> > Platform coverage: all
> >
> > DevTools bug: none
> >
> > Preference: layout.css.cross-fade.enabled
> >
> > Other browsers:
> >
> > There is an older, implemented syntax. In Safari it is unprefixed and in
> > Blink based browsers it is behind the -webkit prefix. This older version
> > only supports two images at a time and has incompatible syntax with the
> > version in the spec. See this
> >  MDN
> article
> > for more information about how the older implementation differs from the
> > specified one. According to Can I Use
> >  and our own queries on
> > httparchive  this older syntax has very little
> > usage.
> >
> > As it receives little usage and does not align with the current
> cross-fade
> > spec we will implement the newer cross-fade syntax according to the CSSWG
> > specification. As the older syntax will not parse this is unlikely to
> > produce unexpected results for the very limited number of webpages
> > currently using the older cross-fade. For all intents and purposes, if a
> > website still uses the older syntax the status quo will remain in effect
> as
> > Firefox will continue to not implement their cross-fade.
> >
> > Webkit bug 179942 
> seems to
> > track this syntax mismatch.
> >
> > web-platform-tests: Will be implemented as part of bug 546052
> > .
> >
> > Secure Contexts: Enabled in secure contexts, like other similar CSS
> features
> > Is this feature enabled by default in sandboxed iframes? yes
> > ___
> > dev-platform mailing list
> > dev-platform@lists.mozilla.org
> > https://lists.mozilla.org/listinfo/dev-platform
>
___
dev-platform mailing list
dev-platform@lists.mozilla.org
https://lists.mozilla.org/listinfo/dev-platform

Re: Intent to prototype: cross-fade

[Zeke Medley]

I believe that this is the behavior specified by the CSSWG as well. From
the spec :

> In particular, this means that `cross-fade(white 50%, transparent 50%)`
will produce a partially-transparent solid white image. (Rather than a
partially-transparent gray, which is what you’d get if you averaged the
opaque white and transparent black pixels in non-premultiplied space.)

Is that what you're pointing out? If not, if you could clarify I'd
appreciate it so that we can make sure our implementations are consistent.

On Tue, Jul 14, 2020 at 4:30 PM  wrote:

> Common implementations of crossfade just interpolate the opacity of both
> images, leading to the background "leaking through" for a portion of the
> fade. On a white background, this is a "flash".
>
> If this features gets traction, it is an opportunity to make the "right"
> way the "easy" way. A crossfade between two opaque images, should always be
> opaque.
>
> Good luck! Cheering from the sidelines!
>
> Let me know if I can clarify further.
> ___
> dev-platform mailing list
> dev-platform@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-platform
>
___
dev-platform mailing list
dev-platform@lists.mozilla.org
https://lists.mozilla.org/listinfo/dev-platform

Re: Intent to prototype: cross-fade

[aaaidan]

On Tuesday, 14 July 2020 16:53:48 UTC-7, Jeff Muizelaar  wrote:
> Do Chrome and Safari do it the right way?

Ahem...

Yes. On both counts. 



I'll show myself out. 
___
dev-platform mailing list
dev-platform@lists.mozilla.org
https://lists.mozilla.org/listinfo/dev-platform

Re: Intent to prototype: cross-fade

[Jeff Muizelaar]

Do Chrome and Safari do it the right way?

On Tue, Jul 14, 2020 at 7:30 PM  wrote:
>
> Common implementations of crossfade just interpolate the opacity of both 
> images, leading to the background "leaking through" for a portion of the 
> fade. On a white background, this is a "flash".
>
> If this features gets traction, it is an opportunity to make the "right" way 
> the "easy" way. A crossfade between two opaque images, should always be 
> opaque.
>
> Good luck! Cheering from the sidelines!
>
> Let me know if I can clarify further.
> ___
> dev-platform mailing list
> dev-platform@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-platform
___
dev-platform mailing list
dev-platform@lists.mozilla.org
https://lists.mozilla.org/listinfo/dev-platform

Re: Intent to prototype: cross-fade

[aaaidan]

Common implementations of crossfade just interpolate the opacity of both 
images, leading to the background "leaking through" for a portion of the fade. 
On a white background, this is a "flash". 

If this features gets traction, it is an opportunity to make the "right" way 
the "easy" way. A crossfade between two opaque images, should always be opaque.

Good luck! Cheering from the sidelines!

Let me know if I can clarify further.
___
dev-platform mailing list
dev-platform@lists.mozilla.org
https://lists.mozilla.org/listinfo/dev-platform

Re: Intent to prototype: cross-fade

[Jeff Muizelaar]

Have other browsers expressed an interest in implementing the new syntax?

On Tue, Jul 14, 2020 at 6:15 PM Zeke Medley  wrote:
>
> Summary:
>
> cross-fade is a CSS function part of the CSS Image Module Level 4.
> cross-fade allows for the blending of multiple CSS images with varying
> opacities. For example:
>
> cross-fade(url(“foo.jpg”) 50%,
>
>radial-gradient(circle, transparent 50%, black 150%) 50%);
>
> might be used to add a vignette effect to an image.
>
> Bug link: https://bugzilla.mozilla.org/show_bug.cgi?id=546052
>
> Standard: https://drafts.csswg.org/css-images-4/#cross-fade-function
>
> Platform coverage: all
>
> DevTools bug: none
>
> Preference: layout.css.cross-fade.enabled
>
> Other browsers:
>
> There is an older, implemented syntax. In Safari it is unprefixed and in
> Blink based browsers it is behind the -webkit prefix. This older version
> only supports two images at a time and has incompatible syntax with the
> version in the spec. See this
>  MDN article
> for more information about how the older implementation differs from the
> specified one. According to Can I Use
>  and our own queries on
> httparchive  this older syntax has very little
> usage.
>
> As it receives little usage and does not align with the current cross-fade
> spec we will implement the newer cross-fade syntax according to the CSSWG
> specification. As the older syntax will not parse this is unlikely to
> produce unexpected results for the very limited number of webpages
> currently using the older cross-fade. For all intents and purposes, if a
> website still uses the older syntax the status quo will remain in effect as
> Firefox will continue to not implement their cross-fade.
>
> Webkit bug 179942  seems to
> track this syntax mismatch.
>
> web-platform-tests: Will be implemented as part of bug 546052
> .
>
> Secure Contexts: Enabled in secure contexts, like other similar CSS features
> Is this feature enabled by default in sandboxed iframes? yes
> ___
> dev-platform mailing list
> dev-platform@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-platform
___
dev-platform mailing list
dev-platform@lists.mozilla.org
https://lists.mozilla.org/listinfo/dev-platform