Issues » 105

Chrome is 5, full-text search in CSS, voice commands Read this issue on the Web
HTML 5 - Please enable images? :-) Weekly Issue 105
September 11, 2013
featured
A New Breed of Chrome Apps (and Chrome is 5 Years Old) Google has unveiled a ‘new generation’ of Chrome Apps, Web standards based apps that use the browser as a runtime. 3 apps are showcased here: a photo retouching app, a to-do list, and a racing game.
Google Chrome Blog
Client-Side Full-Text Search in CSS Using data- attributes for indexation, and a dynamic stylesheet with a CSS3 selector for search, it is straightforward to implement a client-side full-text search in CSS rather than JavaScript. Delightfully clever.
François Zaninotto
annyang! Add Voice Commands to Your Site with the Web Speech API A JavaScript library that uses the Web Speech API to let you easily route verbal commands to code in your webapp. Try out the demos if you have Chrome.
Tal Ater
from our sponsor
Frontend Masters: New CSS3 In-Depth Course from Estelle Weyl
Learn how deep the CSS3 rabbit hole goes in this jam-packed, 6+ hour course with CSS luminary Estelle Weyl.

Try a free preview lesson with Estelle where she uses the analogy of fish “CSS SpeciFISHity” to explain how to think about CSS selector specificity.
reading
CSS Lengths Explained An exploration of the definition of CSS length units starting by understanding some of the physical units with the same name. Did you realize a CSS pixel isn’t necessarily the same thing as a device pixel? Learn more here.
Mozilla Hacks
A Primer to HTML5 Video on Mobile Alicia Liu gives some pointers for navigating your way around implementing HTML5 video solutions on mobile platforms.
HTML5 Hub
Ignoring Library Code While Debugging in Chrome Firefox recently released a ‘black boxing’ feature that lets you ‘black-box’ JavaScript files on a case-by-case basis. When a library is black-boxed the Debugger ignores it so when you’re stepping through code the Debugger will automatically step over black-boxed sources. But how can you do this in Chrome too?
Divshot
Ellipse My Text... Kyle Simpson looks at the art of added ellipses (…) to the end of your incomplete lines of text.
HTML5 Hub
CSS3 3D Transformations: backface-visibility A CSS property that hides the ‘back’ of an element if it has been rotated far enough in 3D space.
SitePoint
Is WebRTC Ready Yet? A Browser Support Scorecard
It’s still looking like early days for the ever-improving set of real time Web communications standards with Chrome and Firefox leading the way, but Internet Explorer and Safari nowhere to be seen.
AndYet
Retro Game Music using Web Audio and Band.js Brian Rinaldi shows how the Band.js library creates 8-bit game music using JavaScript and the Web Audio API by recreating music from Zelda.
Flippin' Awesome
The Beginner's Guide to three.js A step by step guide to using three.js to create a WebGL-backed 3D logo.
Treehouse Blog
Cloning the UI of iOS 7 with HTML, CSS and JavaScript
Côme Courteault
Hiding JSON-Formatted Data in The DOM with Content Security Policy Enabled
Mathias Bynens
watching
h2 {position: sticky} A look at ‘sticky positioning’.
Corey Ford (Mozilla)
code and tools
favico.js: Make A Use of Your Favicon with Badges, Images or Videos The latest in a line of ‘favicon’ manipulation libraries, favico.js lets you add numeric notifications with various effects, supports playing an HTML5 video inside an icon, and can even display your webcam output in the icon.
Miroslav Magda
7 Useful Mobile HTML, CSS, and JavaScript Snippets Prevent page zooming, hide the address bar, detect orientation changes, add an HTML5 app manifest, and more.
David Walsh
Hyper: A Real-Time Desktop HTML5 Editor Works on Windows, Mac OSX, and Linux.
Jared Wright
25 Useful HTML5 Tools For Designers & Developers
Graphic Design Junction
CSS3 Animation Cheat Sheet: Preset, Plug-and-Play Animations for Your Pages
Justin Aguilar
jobs
Software Engineer - Product at Coursera Coursera is looking for JavaScript/HTML5 experts to build high quality web applications that bring online courses to our students. As part of our small and agile team of software engineers, you will be responsible for architecting and implementing the front-end designs, and working with other members on the team to integrate the the application into our platform.
Coursera
demos
'Snake' Game Implemented in a WebGL Shader An interesting demo where a simple but complete(ish) game of ‘snake’ (a.k.a. Nibbles to older readers!) is implemented in a WebGL shader.
GLSL Sandbox
Hackers Courted by Government for Cyber Security Jobs A Rolling Stone feature that uses some interesting effects built on Web standards.
Rolling Stone
console.logtro: The World's First console.log Demo A small demo-scene style demo that runs in the JavaScript console.
Richard Davey
Beez: A Real-time Audio Experiment on the Web Uses WebRTC and the Web Audio API to let you use smartphones as synthesizer effect controllers. There’s a video showing it off if you want a quicker look.
Gaëtan Renaudeau
Senshi (MMO Battle-Royale Inspired HTML5 Game)
Zoli Kahan
HTML5 Live Video Streaming via WebSockets
PhobosLab
last but not least..
DreamFactory – Open Source REST & JSON Services for HTML5 & Javascript Developers Simple REST and JSON services for OAuth, users, SQL, MongoDB, CouchDB, BLOBs, and external API access. Use our free hosted version or install the free open source package on any LAMP server. Sign up and see examples for AngularJS, jQuery, and Sencha.
(Sponsored Item)
Curated by Peter Cooper and published by Cooper Press.
Want to sponsor an issue? See our media kit.

© 2013 Cooper Press Ltd. Email policy Privacy policy
Office 30, Fairfield Enterprise Centre, Louth, LN11 0LS, UK
Update your email address
or unsubscribe here

ONE e-mail each Wednesday. Easy to unsubscribe. No spam — your e-mail address is safe
Published by Cooper Press and curated by Peter Cooper