We are going to use MediaElement.js to embed audio and video as well as control…the audio and video with JavaScript. If you don't have access to the exercise…files, just click the download button on the MediaElement.js.com website.…If you do have access to the exercise files, then check out chapter four, 01 in…the start folder. There's also, at the same level, a…mediaelementjs folder. And what we're going to do is copy the flashmediaelement.swf.…
For browsers that don't support the audio or video format we're using, the Flash…media element will pick up and load it into a Flash player.…So, let's copy the SWF into the start folder.…We'll create a new folder inside of there called media.…And I'm going to paste it inside of there. Let's got back and also copy this…JavaScript file. I'll expand this, so if you don't have the…exercise files you can see exactly which one it is.…It's the mediaelement-and-player.min.js file.…
There's actually multiple ones in the package.…So let's paste that into the JS folder, and then I'm going to open the index.html…
Author
Released
6/26/2013Need more information on creating an initial web presentation? Watch the related HTML5 Projects: Creating a Responsive Presentation course.
- Embedding a Twitter feed in an iframe
- Creating the code for automatic playback
- Using MediaElement.js in your presentation
- Adding video and audio
Skill Level Advanced
Duration
Views
Related Courses
-
Deke's Techniques
with Deke McClelland155h 55m Intermediate
-
Introduction
-
Welcome42s
-
-
1. Understanding the Project
-
2. Enhancing the Slideshow
-
3. Creating a Self-Running Slideshow
-
Adding bullet timing3m 32s
-
4. Adding Audio and Video
-
Adding video10m 38s
-
5. Finalizing the Self-Running Mobile Presentation
-
Custom tweaks for iPad9m 39s
-
6. Enabling Offline Playback
-
Conclusion
-
Next steps40s
-
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.
CancelTake notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.
Share this video
Embed this video
Video: Using MediaElement.js in your presentation