DPlayer

Wow, such a lovely HTML5 danmaku video player

Introduction

DPlayer is a lovely HTML5 danmaku video player to help people build video and danmaku easily.

DPlayer supports:

Streaming formats
- HLS
- FLV
- MPEG DASH
- WebTorrent
- Any other custom streaming formats
Media formats
- MP4 H.264
- WebM
- Ogg Theora Vorbis
Features
- Danamku
- Screenshot
- Hotkeys
- Quality switching
- Thumbnails
- Subtitle

Using DPlayer on your project? Let me know!

Demo

Docs

Install

$ npm install dplayer --save

Quick Start

<link rel="stylesheet" href="dist/DPlayer.min.css">
<div id="player1"></div>
<script src="dist/DPlayer.min.js"></script>

var dp = new DPlayer({
    element: document.getElementById('player1'),
    video: {
        url: 'dplayer.mp4',
        pic: 'dplayer.png'
    },
    danmaku: {
        id: 'testid',
        api: 'https://api.prprpr.me/dplayer/'
    }
});

Usage

Read the Docs

CDN

FAQ

Why can't some videos be full screen?

If player is contained in a iframe, try adding the allowfullscreen attribute to the iframe.

For full browser support it should look like this:

<iframe src="example.com"
        allowfullscreen="allowfullscreen"
        mozallowfullscreen="mozallowfullscreen"
        msallowfullscreen="msallowfullscreen"
        oallowfullscreen="oallowfullscreen"
        webkitallowfullscreen="webkitallowfullscreen"></iframe>