The <track> element represents a timed text file to provide users with multiple languages or commentary for videos. You can use multiple tracks and set one as default to be used when the video starts.
You can provide a transcript of the video.
This article introduces how can use WebVTT (Web Video Text Tracks) and Media Multiple Text Tracks API as part of your video.
When you display video in HTML5, you have may want to display a set of controls to the user. The HTML5 video tag has a control attribute that lets you display the controls that come with the browser.
But you may want to build custom controls using its media API, and the media events. Play, pause, and seek in the entire video, change the volume, mute, change the playback rate (including going into negative values).
This post shows how you can build a custom media player using different the media API attributes, events, and methods.
Continue reading “HTML5 Tutorial – Custom Controls for Multimedia”
HTML5 defines a new element which specifies a standard way to embed a video/movie on a web page: the <video> element.
Internet Explorer 9+, Firefox, Opera, Chrome, and Safari support the video element, but you may need multiple files to support the video formats.
For this demo, I’m using a video that is in the public domain, Popeye for President.
One of the new features that you may want to use in your line of business application is local storage. We can store data locally or use cookies.
localstorage provides a way to persist data on the client side without using cookies. The localStorage attribute provides persistent storage areas for domains. It allows Web applications to store nearly 10 MB of user data, such as entire documents or a user’s mailbox, on the client for performance reasons.
You can create offline applications using the Application Cache API (or AppCache) that is defined in the HTML5 Specification.
AppCache enables webpages to cache (or save) resources locally, including images, script libraries, style sheets, and more. In addition, AppCache allows URLs to be served from cached content using standard Uniform Resource Identifier (URI) notation.
Appcache was intended to let your web app run offline, no Internet connection required, but it can also be used online to dramatically decrease load times.
Continue reading “HTML5 Tutorial – AppCache for Offline Apps”
SVG is a widely-deployed royalty-free graphics format developed and maintained by the W3C SVG Working Group. It is a language for describing 2D-graphics and graphical applications in XML.
With SVG, you can use XML and JavaScript to create web graphics that respond to user actions with sophisticated effects such as highlighting, tool tips, audio, and animation.
This post provides an introduction to the cool effects you can produce with filter effects and animation.
Continue reading “HTML5 Tutorial – SVG Introduction to Filter Effects, Animation”
SVG is a widely-deployed royalty-free graphics format developed and maintained by the W3C SVG Working Group. It is a language for describing 2D-graphics and graphical applications in XML.
You can find an overview of SVG a previous section, you’ll learn about Basic Shapes, Path, Text, and Fonts. In this section, you will learn more things you can do with shapes and text, such as clipping, gradients, tranforms.
With SVG, you can use XML and JavaScript to create web graphics that respond to user actions with sophisticated effects such as highlighting, tool tips, audio, and animation.
The most recent browser versions support most of SVG 1.1.
Continue reading “HTML5 Tutorial – SVG Clipping, Gradient, Transforms”
SVG is a widely-deployed royalty-free graphics format developed and maintained by the W3C SVG Working Group. It is a language for describing 2D-graphics and graphical applications in XML.
With SVG, you can use XML and JavaScript to create web graphics that respond to user actions with sophisticated effects such as highlighting, tool tips, audio, and animation.
SVG is a widely-deployed royalty-free graphics format developed and maintained by the W3C SVG Working Group. It is a language for describing 2D-graphics and graphical applications in XML.
You can find an overview of SVG in our previous post. In this section, you’ll learn about Basic Shapes, Path, Text, and Fonts.
With SVG, you can use XML and JavaScript to create web graphics that respond to user actions with sophisticated effects such as highlighting, tool tips, audio, and animation.
Continue reading “HTML5 Tutorial – SVG Basic Shapes, Viewport, Path, Text, Fonts”
SVG is a widely-deployed royalty-free graphics format developed and maintained by the W3C SVG Working Group. It is a language for describing 2D-graphics and graphical applications in XML.
With SVG, you can use XML and JavaScript to create web graphics that respond to user actions with sophisticated effects such as highlighting, tool tips, audio, and animation.
The most recent browser versions support most of SVG 1.1.
Continue reading “HTML5 Tutorial – Introduction to SVG, SVG Tooling”
AzureDays 