Firefox accelerometer
Paul Rouget shows off some cool new demos that are baking on the trunk of Firefox currently.
First are some nifty new events that get fired if your computer has an accelerometer:
-
window.addEventListener(“MozOrientation”, function(e) {
-
/* 3 values: e.x, e.y, e.y */
-
}, true)
It works with MacBooks and on Windows and Linux with Thinkpads.
Check out this cool screencast of the orientation event in action:
They also have WebGL and CSS Transitions going in Firefox trunk now as well! There are some demos in the original blog post of WebGL + CSS3 + SVG as well as CSS Transitions + the HTML5 Video tag that are very cool (require Firefox Nightly).
Here’s an example code snippet showing how you can use CSS Transitions to change the background color of a DIV over time as well as changing the width and height of an HTML5 Video at the same time:
-
div {
-
-moz-transition-property: background-color, height, width, font-size;
-
-moz-transition-duration: 2s, 1s, 2s, 1s;
-
-webkit-transition-property: background-color, height, width, font-size;
-
-webkit-transition-duration: 2s, 1s, 2s, 1s;
-
}
-
div video {
-
-moz-transition-property: width, height;
-
-moz-transition-duration: 2s, 2s;
-
-webkit-transition-property: width, height;
-
-webkit-transition-duration: 2s, 2s;
-
}
Someone’s also put together a cool demo that puts the new accelerometer support with some SVG to create a Super Mario Kart clone:
Fonte:Ajaxian
Tags: accelerometer, FireFox, javascript, mozilla
ajax/javascript | Filipe Teixeira Nunes | 
14/10/2009 17:21 | 
Comments (0)
Subscribe