Video quality switcher

Code Setup

Qualities menu appears automatically if only multiple resolution variants of media are defianed.

<!--Load player and Nuevo plugin with skin -->
<link href="../skins/nuevo/videojs.min.css" rel="stylesheet" type="text/css" />
<script src="../video.min.js"></script>
<script src="../nuevo.min.js"></script>

<!--Multiple reslolution video on page setup-->
<video id="player_1" class="video-js vjs-fluid" controls preload playsinline poster="../examples/assets/images/coffee.jpg">
	<source src="//opencdn.b-cdn.net/video/hls/people/playlist.m3u8" type="application/x-mpegURL">
</video>

<!--Initialize player and plugin-->
<script>
	var player = videojs('player_1');
	player.nuevo({ 
		//option1: value,
		//option2: value
	});
</script>

Resolution only display

By default you can see both: resolution and bitrate values in qualities menu. You can order to display resolution only.

Code Setup

	var player2 = videojs('player_2');
	player2.nuevo({ 
		resOnly:true,
		//option2: value,
		//option3: value
	});
	

Qualities menu as Settings submenu


By default qualities menu is displayed separately in control bar. You can also order to display it as setting submenu by setting nuevo plugin option qualityMenu: true.

Code Setup

<script>
	var player3 = videojs('player_3');
	player3.nuevo({ 
	    qualityMenu: true,
	});
</script>