Create An HTML5 Video Player From Scratch

Put your web development skills into practice with a nice project!
4.6 (693 ratings)
Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
23,507 students enrolled
Start Learning Now
  • Lectures 12
  • Length 1.5 hours
  • Skill Level Beginner Level
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works


Find online courses made by experts from around the world.


Take your courses with you and learn anywhere, anytime.


Learn and practice real-world skills and achieve your goals.

About This Course

Published 9/2014 English

Course Description

Put your HTML, CSS and JavaScript skills into practice by building a fully customizable video player. We will start from scratch (apart from some icons that I'm going to give you at the beginning) and build our way to a YouTube video-player look-a-like. The videos will be in a step-by-step format, so that it will be easy to follow along. All source code will be available at our website.

Afterwards, you will be able to create awesome video players using the latest HTML5 video API; they will be both stunning through CSS and functional through JavaScript.

What are the requirements?

  • HTML
  • CSS
  • JavaScript

What am I going to get from this course?

  • In this course, you will learn how to use the HTML5 media API
  • By the end of the course, you will be able to build your own fully customizable video players for the world wide web

Who is the target audience?

  • Front-end developers
  • Back-end developers

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.


Section 1: HTML And CSS
Embedding A Video
Building The Player
Styling Part 1
Styling Part 2
Section 2: JavaScript
Play And Pause
Progress Bar Part 1
Progress Bar Part 2
Time Field
Sound Control
Overlapping Pause Screen
Section 3: The End
Thank You

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Cocotuts Tutorials, The web development platform

At Cocotuts, we're very passionate about teaching valuable programming skills to those who love to keep learning.

We are an educational platform for the latest technologies in programming and modern web development, delivering nothing but top quality content. Our teachers offer a structured learning environment by providing you with courses in a step-by-step format, filled with engaging examples and useful build-along projects to optimize your learning experience.

Ready to start learning?
Start Learning Now