Tutorials Page 137
![CSS Columns]()
CSS Columns
One major gripe that we've always had about CSS is that creating layouts seems to be more difficult than it should be. We have, of course, adapted and mastered the techniques for creating layouts, but there's no shaking the feeling that there should be a...
![Detecting Mozilla App Install Capabilities with JavaScript]()
Detecting Mozilla App Install Capabilities with JavaScript
If you follow me on Twitter, you know I'm riveting super excited about the forthcoming Firefox Marketplace. A marketplace where you can download desktop, tablet, and mobile phone applications based on web technologies, from a host with a record as awesome as Mozilla, is...
![CSS pointer-events]()
CSS pointer-events
The responsibilities taken on by CSS seems to be increasingly blurring with JavaScript. Consider the
-webkit-touch-calloutCSS property, which prevents iOS's link dialog menu when you tap and hold a clickable element. Thepointer-eventsproperty is even more JavaScript-like, preventing: click actions from doing...![Node.js CSS Compressor: clean-css]()
Node.js CSS Compressor: clean-css
One of my recent finds on the goldmine that is GitHub is GoalSmasher's account. The GoalSmashers team has created three notable (or at least useful to me) utilities you all should know about: enhance-css: embeds imagery into stylesheets via Base64 encoding
![Locating the iPhone and iPad Simulators on Mac]()
Locating the iPhone and iPad Simulators on Mac
I recently received a new MacBook Pro and started configuring debugging tools I had debugged ages ago on my personal machine. In doing so, I completely forgot that the iOS Simulator provided by XCode isn't added directly to the Applications directory; instead, you have to dig...
![X-Tag Web Components]()
X-Tag Web Components
One of the awesome parts at working at Mozilla is being able to see and use projects from fellow engineers before they are shared with the world. One such effort comes from Daniel Buchner: X-Tag. X-Tag is a cross-browser web component...
![Function Debouncing with Underscore.js]()
Function Debouncing with Underscore.js
The ability to listen and react to user interactions with JavaScript is fundamental and incredibly useful. Some interactions happen frequently and some rarely. Some listener functions are light of action, others can be quite taxing on the browser. Take window's resize event for...
![Toggle Element State with Google Chrome and Mozilla Firefox]()
Toggle Element State with Google Chrome and Mozilla Firefox
It's much easier to debug CSS than JavaScript since there are many fewer interactions in CSS, and they are much easier emulate. Still, element state debugging isn't simple...until now. Google Chrome's WebInspector and Mozilla Firefox's Firebug have a really sweet feature I just discovered...
![Firefox Marketplace Animated Buttons]()
Firefox Marketplace Animated Buttons
The Firefox Marketplace is an incredibly attractive, easy to use hub that promises to make finding and promoting awesome HTML5-powered web applications easy and convenient. While I don't work directly on the Marketplace, I am privy to the codebase (and so...
![JavaScript CustomEvent]()
JavaScript CustomEvent
JavaScript events have been the gateway to user interaction within the browser since its inception. Not only do events tell us when an interaction happens, but events tell us type of interaction, the nodes involved, and provide us methods for working with the event.







