O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

HTML5 Media

Book Description

A detailed introduction to presenting audio and video in HTML5, from markup through scripting. It will explain not just placing content in pages but interaction through Javascript APIs, to build media players that could be used cross-browser.

Table of Contents

  1. Special Upgrade Offer
  2. A Note Regarding Supplemental Files
  3. Preface
    1. About this Book
      1. Book Audience
      2. Examples
      3. Target Browsers
      4. The Polyglot Question: HTML or XHTML?
    2. Conventions Used in This Book
    3. Using Code Examples
    4. SafariĀ® Books Online
    5. How to Contact Us
    6. Acknowledgments
  4. 1. HTML5 Audio and Video Elements: By-Default
    1. Adding a Media Element to a Web Page
      1. Minimal Element Syntax
      2. Disabled Scripting and the Magically Appearing Controls UI
    2. Support for Multiple Media File Types
    3. The Audio and Video File Babble and the Source Element in Detail
      1. HTML5 Audio Codecs/Containers and Lossless versus Lossy Compression
        1. WAV Audio Format
        2. MP3
        3. Ogg Vorbis
        4. The AAC Codec
        5. WebM Audio
        6. Providing Codec information in the type attribute
      2. HTML5 Video Element Codecs/Containers
        1. H.264
        2. Ogg Theora
        3. WebM
        4. Ensuring Complete Video Codec Support
    4. The Media Elements in More Detail
      1. Media Elements and Global Attributes
      2. Media-Specific Attributes
      3. Video-Only Attributes and Video Resolutions
    5. Audio and Video in Mobile Devices and Media Profiles
      1. Challenges of a Mobile Environment
      2. Media Profiles and Codec Parameters
    6. Converting Audio and Video Content
      1. The Free Mp3/Wma/Ogg Converter
      2. Video Conversion with Miro Video Converter and Handbrake
      3. Using a Frame Grabber
  5. Customizing Media Elements
    1. CSS Styling
      1. Adding a Fancy Border
      2. Using the CSS Pseudo Classes
      3. Applying a CSS3 Transform to a Video Element
      4. Animating the Transforms with CSS3 Transitions
      5. Adding an Overlay
    2. Custom Controls with JavaScript and CSS
      1. Creating a Basic Control
      2. Adding CSS and Tracking Playback
      3. Creating a Custom Progress Bar
      4. The Custom Control and Seekability
    3. Debugging and Discovering Browser Support
  6. Media Elements, Multiple Tracks, and Accessibility
    1. Media Controllers and the MediaController Interface
    2. Multiple Tracks and the Track List Interfaces
      1. Audio and Video Track Collections
      2. Multiple Text Tracks
    3. The Track Element
      1. Track File Formats
        1. SRT
        2. WebVTT
    4. JavaScript Support for Subtitles and Captions
      1. Captionator
      2. Playr
      3. The Leanback Player
  7. 4. Advanced Media Element Scripting
    1. Media Elements and Canvas
      1. Playing a Video in an Canvas Element
      2. Creating a Video Visual Filter using the Canvas Element
    2. Media Elements and SVG
      1. Adding an HTML5 Video to an SVG Document
      2. Applying SVG Filters to Video Files within HTML
    3. The Audio Data APIs
  8. A. HTML Media Frameworks and Tools
    1. Subtitle/Caption Rendering Library
    2. Video Players
      1. Audio Only or Audio/Video Players
    3. Other Libraries, Utilities, and Toys
  9. About the Author
  10. Colophon
  11. Special Upgrade Offer
  12. Copyright