11.6. Conclusion

In this chapter you saw how to make your Canvas-based applications run on mobile devices. We began by looking at the mobile viewport and the associated viewport metatag, which lets you configure the offscreen layout viewport used by multiple browsers. Then we looked at media queries, how you can use them to customize CSS that you use for particular devices, and how you can use media query list listeners in JavaScript to react to media feature changes, such as device orientation changes.

You also saw how to handle touch events and how to portably implement pinch and zoom using the touch events API.

Then we took a short detour to examine how to make your HTML5 applications indistinguishable from native applications on iOS5, including creating application icons and startup images and running your applications fullscreen, with no browser chrome.