Scripts
HTML5

Responsive HTML5 YouTube Vimeo Video Player

Video player with responsive web design and multiple choice original skins with unique designs. It has an advanced functionality such as: annotations, multilingual subtitles, playlist, advertising, video chapters and control by keyboard shortcuts. This player works in all modern browsers and supports HTML5, YouTube and Vimeo video formats.

  • HTML5, YouTube & Vimeo video formats
  • 6 skins with unique design
  • Multiple color themes for skins
  • Video advertising
  • 4 types of annotations
  • Chapters for video
  • Multilingual subtitles
  • Responsive web design
  • Playlist navigation
  • Keyboard shortcuts for player
  • Cross-browser support
  • Easy to use and customize

Features

  • Responsive web design. All skins, included in this player, are tested and optimized for different screen sizes and adjust their appearance according to the device used and its screen size. They perfectly work and look on mobile phones, tablet PCs and desktop computers.
  • Skins. It contains 6 original skins with unique designs where some of them have several color themes.
  • Multiple video formats. There are three video formats that are supported by the player: regular HTML5 video (MP4, WebM, Ogg), YouTube and Vimeo videos.
  • Multilingual subtitles. The player supports subtitles in several languages for each video in the list. The language can be changed on the fly while video is playing. It supports subtitles in WebVTT format.
  • Video advertising. For each video in the playlist a video advertising can be set that will automatically start playing at the beginning of the video or in the set time interval while playing. A video advertising has a "skip" button that becomes active in the set time interval. Advertising videos can be in any video formats that are supported by the player: HTML5, YouTube & Vimeo.
  • Playlist. This player generates a video playlist where each video is represented as a block with duration time, preview image, title and short description.
  • Annotations. It supports 4 types of annotations, such as:
    • Speech bubble creates pop-up speech bubbles with text.
    • Spotlight highlights areas in a video; when the user moves the cursor, over these areas text appears.
    • Note creates pop-up boxes with text.
    • Label creates a label to highlight and name a specific part of a video.
  • Customization of annotations.
    • Speech bubble tail (arrow) can be attached to any of four sides of a box with a particular offset.
    • Spotlight and Label can be marked with: time icon - shows that this reference will jump to a specific time in a video, link icon - shows that this reference is a regular link to a webpage, playlist icon - shows that this reference will immediately play a particular video from the current playlist statring from a certain time.
    • Speech bubble and Note can contain HTML.
  • Your logo. A logo with a link can be defined and then shown on the top right corner throughout all videos.
  • Full-screen mode. The player can be switched to full-screen mode, keeping the control panel and playlist usable.
  • Multiple sources. For each video, several sources can be set, in case some of them are not available, the first available will be used.
  • Easy to use and customize. This player is developed as a plugin for jQuery which makes it flexible in use. Once the player is initialized, whole its content (playlist, annotations, subtitles) is generated automatically according to elements inside video element.
  • Documentation. It has a well-written documentation with a bunch of examples and explanations on how they work.

If you like it, don't forget to rate it!

Show More
Appreciated on June 15th, 2015

More items by swebdeveloper

by in