Firefox 开发亮点 - 每个窗口的私人浏览和 Canvas 的 globalCompositeOperation 新值

我们定期在我们的 前沿系列 中重点介绍 Firefox 为开发者提供的最新功能,大多数示例仅在 Firefox Nightly 中有效(并且可能会有所更改)。

每个窗口的私人浏览

私人浏览对于 Web 开发人员非常有用。新的私人会话不包括现有的持久数据(Cookie 和 HTML5 存储)。如果我们想测试一个存储数据的网站(登录和持久信息),而无需每次清除这些缓存数据,或者如果我们想使用 2 个不同的用户登录到某个服务,这将很方便。

到目前为止,在 Firefox 中进入私人浏览时,会关闭现有会话以启动新会话。现在,Firefox 将保留当前会话并打开一个新的私人窗口。您可以在 Firefox Nightly(即将发布的 Firefox 20)中测试它。虽然还有一些前端工作要做,但该功能已经可以工作了。

Canvas 的 globalCompositeOperation 新值

“globalCompositeOperation” Canvas 属性允许您定义您希望 Canvas 如何在现有图像上绘制图像。默认情况下,当 Canvas 在现有像素上绘制图像时,新图像只是替换这些像素。但是,还有其他方法可以混合像素。例如,如果您设置 ctx.globalCompositeOperation = "lighter",则像素颜色值将被添加,从而产生不同的视觉效果。

有几种效果可用,您可以在 MDN 上的 globalCompositeOperation 中找到更多信息。

来自 Adobe 的 Rik Cabanier 扩展了 Canvas 规范 以包括更多效果。他还 在 Firefox Nightly 中实现了这些新效果。这些新效果被称为“混合模式”。这些是更高级的混合颜色的方法。

请查看 这些新混合模式的列表

以下是如何使用它们的示例

JS Bin 演示.

如果您没有使用 Firefox Nightly,这里有一个(很长的)截图

image

关于 Paul Rouget

Paul 是一位 Firefox 开发人员。

更多来自 Paul Rouget 的文章...

关于 Robert Nyman [名誉编辑]

Mozilla Hacks 的技术布道者和编辑。关于 HTML5、JavaScript 和开放 Web 进行演讲和博客。Robert 是 HTML5 和开放 Web 的坚定支持者,自 1999 年以来一直在从事 Web 前端开发 - 在瑞典和纽约市。他还定期在 http://robertnyman.com 上发布博客,并喜欢旅行和结识新朋友。

更多来自 Robert Nyman [名誉编辑] 的文章...


9 条评论

  1. Caspy7

    感谢您提供图形插图/截图。

    2012 年 12 月 24 日 下午 2:29

  2. k

    所以我们现在可以使用纯 CSS 制作 GIMP-lite 了? :-)

    2013 年 4 月 3 日 上午 5:45

    1. Robert Nyman [编辑]

      是的,尽情发挥吧!:-)

      2013 年 4 月 3 日 上午 8:11

  3. scootergrisen

    只是我吗,还是在 Firefox 20.0 中颜色减淡和颜色加深会产生相同的结果?

    2013 年 4 月 6 日 下午 2:58

  4. Slipp D.

    刚刚更新到 Firefox 20.0,它声称实现了此功能并链接到此帖子,但我没有在演示中看到任何效果。我应该在哪里报告这个问题?;-/

    2013 年 4 月 8 日 上午 0:48

    1. Robert Nyman [编辑]

      请先联系 Firefox 支持。谢谢!

      2013 年 4 月 8 日 上午 10:08

      1. Slipp D.

        听起来很简单。谢谢。

        2013 年 4 月 8 日 上午 10:19

  5. Michael Mullany

    有希望在不久的将来看到新的混合模式出现在 SVG 滤镜中吗?

    2013 年 4 月 8 日 上午 11:07

    1. Robert Nyman [编辑]

      不幸的是,我现在对此了解不多。

      2013 年 4 月 8 日 下午 11:55

本文的评论已关闭。