a multi-touch drawing demo for Firefox 3.7

Firefox Multitouch at MozChile – Drawing Canvas Experiment from Marcio Galli on Vimeo.

A couple of months ago we featured a video that had some examples of multi-touch working in Firefox. At a recent event in South America, Marcio Galli put together a quick and fun drawing program based on the multi-touch code that we’ll have in a later release of Firefox. What’s really great is that he was able to put this together in just a couple of hours based on the web platform.

There are three main components to the touch support in Firefox:

1. Touch-based scrolling and panning for the browser. This allows you, as a user, to scroll web pages, select text, open menus, select buttons, etc. This is part of Firefox 3.6.

2. Implement a new CSS selector that will tell you if you’re on a touch-enabled device. This is <a href="https://developer.mozilla.org/en/CSS/:-moz-system-metric%28touch-enabled%29">-moz-system-metric(touch-enabled)</a>. You can use this in your CSS to adjust the size of UI elements to fit people’s fingers. This is part of Firefox 3.6.

3. Exposing multi-touch data to web pages. This takes the form of DOM events much like mouse events you can catch today. This isn’t part of Firefox 3.6, but is likely to be part of Firefox 3.7.

Although not all of this will be in our next release we thought it would be fun for people to see what will be possible with the release after 3.6.

Note: You can find the sample code on Marcio’s page for the demo.


  1. AndyEd

    Got a pointer to a multi-touch build for windows 7?

    October 13th, 2009 at 16:08

  2. Daniel Glazman

    Uuuuurrrrrghhhh…. Who decided and who accepted that syntax…

    October 13th, 2009 at 23:04

  3. […] upcoming Firefox 3.6 release will have basic support for touch-enabled devices like you will be able scroll & pan web pages, select text on the […]

    October 14th, 2009 at 02:52

  4. […] is a nice video on Mozilla hacks demonstrating multi-touch in Firefox 3.7. A nice multi touch painting application. Interestingly […]

    October 14th, 2009 at 06:00

  5. Christopher Blizzard

    @Andy – looking into that. There were some builds up, I’m trying to see if there are newer ones up.

    @Daniel – yeah, we’re talking about changing it to be something more reasonable. There’s a bug open on that – I think roc had the same reaction you did. :) https://bugzilla.mozilla.org/show_bug.cgi?id=522149

    October 14th, 2009 at 10:00

  6. Felipe Gomes

    @Andy, you can download the builds as a zip or installer from here:

    or you can download the patch from bugzilla and recompile ( https://bugzilla.mozilla.org/show_bug.cgi?id=508906 )

    Hope that helps!

    October 14th, 2009 at 11:45

  7. Jay Patel

    I was able to try out Marcio’s demo with my Lenovo multi-touch x200t with this build:

    October 14th, 2009 at 11:50

  8. Ryan

    I think the CSS pseudo selector would work better as a media query e.g.

    @media (-moz-touch-enabled) { }

    October 14th, 2009 at 15:15

  9. […] a multi-touch drawing demo for Firefox 3.7 A drawing app that runs inside Firefox and uses the multi-touch features that will be available in Firefox 3.7. Now if only all of us had hardware that would support it. [hacks.mozilla] […]

    October 14th, 2009 at 16:20

  10. Spyros

    does this multi-touch feature includes the touchpad found on modern netbooks/laptops ?

    October 14th, 2009 at 16:42

  11. […] 16, 2009 by zENO 用手指塗鴉畫圖(應用 multi-touch 技術的火狐Web軟件) a multi-touch drawing demo for Firefox 3.7 (英文) (按圖直接入去看片,按 link […]

    October 16th, 2009 at 05:25

  12. […] have to ration swag or it would all disappear immediately.  I enjoyed seeing the creativity of the touchscreen demos, the support through each Mozilla keynote/track talk and how excited everyone was to see Mozilla at […]

    October 17th, 2009 at 22:27

  13. Linda Marroquin

    Look at this user interface for multi touch. http://www.youtube.com/watch?v=te9O8HavQpQ

    October 19th, 2009 at 09:31

  14. jacob

    any chances of integration to microsoft tablet sdk on windows? : )

    April 16th, 2010 at 21:58

  15. Ole

    I also would like to try the javascript-multi-touch-support.
    Unfortunately all the build have disappeared :-(
    Does anybody still have a copy?

    May 10th, 2010 at 13:46

  16. karelr

    how can I let firefox 4 beta4 let work the application work on an windows7 starter tablet (archos9)

    thanks to help me

    August 24th, 2010 at 17:17

  17. Oleg

    Argl! Another Multi-touch demo entirely single-touch.

    May 7th, 2011 at 10:52

Comments are closed for this article.