about:mozilla » Web development

SVG effects for HTML content

deb — Mon, 22 Sep 2008 15:15:02 +0000

Robert O’Callahan has been working on adding features to Firefox that allow SVG effects to be applied to HTML content. He originally posted about this work back in June, discussing his experiments with making SVG’s “clip-path”, “mask”, and “filter” properties work when applied to HTML content. Last week Robert announced that this work has been added to the main Mozilla code base, and further that he has submitted his proposal to the SVG working group for standardization. For more information about these new features, including screenshots of them in action and working demos, see Robert’s post on the Web Tech weblog.

Color profile support changes

deb — Fri, 19 Sep 2008 15:56:45 +0000

Bobby Holley has been refining Mozilla’s color management backend, working to improve performance and polish the feature so it’s ready for “prime time”. These efforts have clearly paid off, as color profile support has now been turned on by default for tagged images in the latest Firefox nightly builds. In this context, “tagged images” are any images displayed in the web browser that have an embedded ICC color profile — in other words, images that contain the information needed to do a specific and accurate color transformation. Bobby’s post goes into all the technical aspects of these changes in detail, and also discusses why color management hasn’t been enabled for everything at this time. Percy Cabello has also posted about these changes over at Mozilla Links.

CSS transforms

deb — Fri, 19 Sep 2008 15:54:17 +0000

The folks over at the Web Tech weblog have posted that Gecko (Mozilla’s layout engine) nightly builds now support a new “-moz-transform” CSS property. This property — a version of which is similarly supported by WebKit — is described as a “CSS property that accepts a list of transform functions (generic affine linear transforms) and then applies those transforms, in order, to the HTML elements the property is applied to.” Several examples of how to use the property (and descriptions of what it does) are available in the Web Tech post. “It will be interesting to see what uses developers find for CSS transforms. Much of the functionality once reserved for plugins can now be directly integrated into CSS and JavaScript.” More information and code samples are available in the Web Tech article.

Drag and Drop is here

deb — Fri, 05 Sep 2008 13:33:33 +0000

Neil Deakin has posted a development update about the inclusion of the HTML5 drag and drop API in Mozilla nightly builds. “This is the API that IE and Safari have supported for a while. Now Firefox will support it as well so you can create content in your web pages that can be dragged and dropped elsewhere. The same API is also used for Firefox extensions and XUL applications.” For more information, including examples about how to make things draggable, see Neil’s weblog post. Drag and drop documentation is available at the Mozilla Developer Center.

Firebug 1.2 released

deb — Mon, 25 Aug 2008 16:05:18 +0000

The final version of Firebug 1.2 has been released and will be up on the Mozilla Add-ons site today, and it is immediately available GetFirebug.com. There have been several improvements and a huge number of bug fixes made. Some of the major features in the release include Firefox 3 support, quality improvements, selective panel enablement, and the ability to suspend/resume Firebug. Firebug 1.3 development is already underway and is going to be focused on performance, quality, and testing. John Resig writes, “Firebug is the de facto tool for web developers and we need to make sure that its quality does not wane and that we tackle performance head-on.” For more information, see John’s blog post announcing the release.

New Mozilla Web Tech weblog!

deb — Fri, 22 Aug 2008 18:10:28 +0000

Keeping track of Mozilla development is never easy, especially the minute details related to new or improved web technology development and support. The Mozilla development community has set up a new weblog to fix this, the Web Tech weblog. Here the devs will be posting about and discussing topics of interest to web developers. For example, recent posts include: word-wrap: break word support, CSS 2.1 generated content, and querySelector[All]. Questions and discussions are welcome, so go check out the weblog and stay up to date on all the latest Mozilla web technology.

border-image in Firefox

deb — Mon, 18 Aug 2008 13:51:04 +0000

John Resig has put together some demos for the new CSS 3 border-image implementation that is part of Firefox 3.1. “This is a new CSS 3 module that makes the exact slicing of images (and their positioning around an element) quite easy. The most obvious use case for them exists in constructing beautiful scalable buttons.” You will need a nightly release of Firefox in order for John’s demos to work. He also includes code samples and extensive explanations for the demos.