vLitejs - HTML5 video

Picture-in-Picture plugin

by yoriiis

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vlitejs@5/dist/plugins/subtitle.css">
<script src="https://cdn.jsdelivr.net/npm/vlitejs@5"></script>
<script src="https://cdn.jsdelivr.net/npm/vlitejs@5/dist/plugins/subtitle.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vlitejs@5/dist/plugins/pip.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vlitejs@5/dist/plugins/pip.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vlitejs@5/dist/vlite.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vlitejs@5/dist/plugins/subtitle.css">
<video crossorigin id="player" src="https://yoriiis.github.io/cdn/static/vlitejs/demo-video-html5.mp4"></video>

JavaScript

Vlitejs.registerPlugin('pip', VlitejsPip);

new Vlitejs('#player', {
	options: {
		controls: true,
		autoplay: false,
		playPause: true,
		progressBar: true,
		time: true,
		volume: true,
		fullscreen: true,
		poster: 'https://yoriiis.github.io/cdn/static/vlitejs/demo-poster.jpg',
		bigPlay: true,
		playsinline: true,
		loop: false,
		muted: false,
		autoHide: true
  	},
	plugins: ['pip'],
	onReady: function (player) {
 		console.log(player)
  	}
});