HTML 5 and CSS3 Advanced

    This course is suitable only for those with considerable prior experience and covers: CSS Transitions and Transforms; the canvas element; video and audio; the file api; geolocation; drag and drop; web workers; and offline applications

    CSS Transitions and Transforms

    Transition basics; Exploring transition options

    2D transform fundamentals

    Coding 3D transitions; Enhancing (and not degrading) the user experience

    Simple 2D Transitions and Transforms

    Animating color changes; Fading objects in and out; Growing page elements; Automatically spinning logos; Adjusting font sizes

    Introducing The Canvas Element

    Introducing The Canvas Tag, Understanding The Differences Between Canvas And Svg

    Understanding The Canvas Element And 2D Drawing Api

    Identifying The Canvas Element’S Methods And Properties, Using The Canvas Drawing Context

    Basic Canvas Drawing Techniques

    Setting And Using Colors And Styles, Drawing Basic Shapes: Rectangles And Lines, Understanding The Canvas State, Drawing Complex Shapes: Arcs And Paths, Drawing Complex Shapes: Bézier And Quadratic Curves, Rendering Text

    Complex Canvas Drawing Techniques

    Creating Shadows, Drawing With Patterns, Drawing With Gradients, Using Clipping Paths, Drawing Images And Video

    Advanced Canvas Drawing Operations

    Transforming Objects Using The Translate Tag, Scaling Objects With The Scale Transformation, Rotating Objects With The Rotate Transformation, Applying A Custom Transformation, Compositing In Canvas Using Globalalpha, Manipulating Raw Pixels

    Building Practical Examples

    Building An Image Slideshow Control, Using Smooth Transitions In A Slideshow, Creating A Basic Animation, Creating Animation With Double Buffering, Incorporating Canvas Into A Real Page

    Video And Audio Basics

    Understanding Html5 Video And Audio, The State Of Html5 Video And Audio, Understanding The Format War, Configuring Your Server To Deliver Html5 Media Formats

    Embedding Video And Audio

    Using The Video And Audio Tags, Using Multiple Sources For Browser Compatibility, Preloading, Autoplaying, Looping, Setting A Poster Frame, Setting The Video Width And Height, Displaying Subtitles And Captions

    Falling Back To Alternative Playback Methods

    Falling Back To Flash, Falling Back To Download Links, Using An Embed Code Builder

    Encoding Audio And Video Files

    Understanding Html5 Video Formats, Understanding Html5 Audio Formats, Encoding Mp4/H.264 Video With Handbrake, Encoding Ogg, Theora, And Webm With Firefogg, Encoding Audio Formats With Vlc, Automating Video And Audio Encoding

    Building Your Own Controls With Javascript

    Setting Up The Javascript, Creating Play And Pause Buttons, Creating A Play Progress Bar, Creating A Load Progress Bar, Creating A Current Time And Duration Display