mirror of https://github.com/DIYgod/DPlayer synced 2024-11-22 18:56:54 +00:00

Go to file

DIYgod 0cfb2a76d6 release v1.22.2		2018-02-23 23:20:09 +08:00
.github	add OpenCollective	2018-02-07 15:28:37 +08:00
demo	use art-template	2018-02-09 00:02:22 +08:00
dist	release v1.22.2	2018-02-23 23:20:09 +08:00
src	generate screenshot by blob and createObjectURL	2018-02-23 22:56:14 +08:00
webpack	use art-template	2018-02-09 00:02:22 +08:00
.eslintrc	support WebTorrent	2018-01-19 17:30:35 +08:00
.gitignore	ignore logs	2016-11-08 18:06:13 +08:00
.travis.yml	Travis: update nodejs version, cache yarn and node_modules	2017-12-25 17:21:26 +08:00
LICENSE	update README and LICENSE	2017-07-23 22:13:11 +08:00
package.json	release v1.22.2	2018-02-23 23:20:09 +08:00
README.md	update README	2018-02-07 16:01:08 +08:00
yarn.lock	update dependencies	2018-02-22 12:29:55 +08:00

README.md

ADPlayer

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>