HTML and CSS Reference
In-Depth Information
Playing, Pausing, and Stopping a Video
You need to handle various client-side events in order to make the video player functional. These events
fall into two categories:
• Events of supporting elements such as the Play/Pause and Stop buttons, the volume
control, and the drop-down list
• Events of the <video> element
The events in the first category can be handled using the jQuery event-handling syntax you learned
about in Chapter 2. Listing 3-12 shows various event handlers in this category.
Listing 3-12. Handling Events of Supporting Elements
videoPlayer = $("#videoPlayer").get(0);
$("#ddlPlayList").change(function () {
var extension = $(this).val();
extension=extension.substr(extension.lastIndexOf('.') + 1)
var mime = "";
switch (extension) {
case 'mp4':
mime = "video/mp4";
case 'ogv':
mime = "video/ogg";
case 'webm':
mime = "video/webm";
if (videoPlayer.canPlayType(mime)) {
videoPlayer.src = $(this).val();
else {
alert("Cannot play this video format!");
$("#btnPlayPause").click(function () {
if ($(this).val() == "Play") {
videoPlayer.playbackRate = $("#rngPlaybackRate").val();;
else {
Search WWH ::

Custom Search