HTML5 Player Settings

When the HTML5 video is converted, you get a set of files to upload to your server and the following code to insert into your HTML page:
<link href="dvs/dvs_common_style.css" type="text/css" rel="stylesheet" />
<script src="dvs/ClassicSkinPlay.js" type="text/javascript"></script>
<script src="dvs/ClassicNeoSkinPlay.js" type="text/javascript"></script>
<script src="dvs/LineSkinPlay.js" type="text/javascript"></script>
<script src="dvs/LineSimpleSkinPlay.js" type="text/javascript"></script>
<script src="dvs/dvs_settings.js" type="text/javascript"></script>
<script src="dvs/DragObject.js" type="text/javascript"></script>
<script src="dvs/dragMaster.js" type="text/javascript"></script>
<script src="dvs/helpers.js" type="text/javascript"></script>
<script src="dvs/dvsplayer.js" type="text/javascript"></script><div id="dvsPlayer">
<video>
<source src="video/video.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
<source src="video/video.ogv" type='video/ogg; codecs="theora, vorbis"'>
</video>
</div>
<script type="text/javascript">
var dvsPlayer = new DVS_html5player();
var skin = new ClassicSkinPlay();
var sett = new dvsplay_settings();
//Here you can change setings which are defined in the file dvs_settings.js
dvsPlayer.Skin = skin;
dvsPlayer.settings=sett;
dvsPlayer.VideoTitle="Video title";
dvsPlayer.Init('dvsPlayer');
</script>

You can choose one of the four themes for your player:

Theme: Classic
Theme: Classic Neo
Theme: Line
Theme: Line Simple

Basic parameters for the player are defined in the file /dvs/dvs_settings.js. You can change these parameters as you like.

function dvsplay_settings () {
// Basic parameters
this.width=600;
this.height = 400;

this.backgroundColor="#000000";
this.controlBackgroundColor="#333333";

// Parameter affecting visibility of controls
this.displayMuteButton = true;
this.displayPlayPauseButton = true;
this.displayAutoPlayButton = true;
this.displayFullScreenModeButton = true;

this.displayVolumeControl = true;
this.displayTrackBar = true;

this.displayVolumeDigital = true;
this.displayVideoLengthDigitals = true;

// Parameters of the initial state of the player
this.startVolume = 0.5;
this.startPosition = 0;
this.muteButtonAtStart = false;

this.autoRewind = true;
this.autoPlay = true;
}

Note that the parameters which are defined in this file can be overwritten by the parameters which are set by the Theme. For example, if you set the player's width to 200, but the Theme's minimum width is set to 300, your player will have the width of 300.

width
Player's width (It is automatically changed if you apply a skin)

height
Player's height including the control panel (The height is automatically changed if you apply a Theme)

backgroundColor
Die Player's fill color in RGB format. E.g. "#0000FF" stands for blue. If the video has a smaller resolution than that of the player, the space will be filled with the fill color.

controlBackgroundColor
Control panel fill color in RGB format. E.g. "#0000FF" stands for blue.

displayMuteButton
Display/hide the Mute button (true - display, false - do not display)

displayPlayPauseButton
Display/hide the Play/Pause button (true - display, false - do not display)

displayAutoPlayButton
Display/hide the AutoPlay button (true - display, false - do not display)

displayFullScreenModeButton
Display/hide the Full Screen Mode button (Not all browsers support html5 video playback in Full screen mode)

displayVolumeControl
Display/hide the Volume Control button (true - display, false - do not display)

displayTrackBar
Display/hide the Track bar (true - display, false - do not display)

displayVolumeDigital
Display/hide the volume control digitals (true - display, false - do not display)

displayVideoLengthDigitals
Display/hide digitals showing the length of the video (true - display, false - do not display)

startVolume
Initial volume level. Values from 0 (mute) to 1 (maximum volume)

startPosition
Initial playback position. Values from 0 (the beginning of the video) to 1 (the end of the video)

muteButtonAtStart
The Mute button state at start (true - muted, false - not muted)

autoRewind
Automatic rewind (true - the playback starts again after the video reaches its end, false - the playback stops at the end of the video)

autoPlay
Autoplay function (true - the playback starts automatically after the page is loaded, false - the playback starts when the Play button is pressed)

Follow us
DVDVideoSoft facebook
More than 600,000 likes!
Subscribe to our newsletter
More than 200,000 subscribers!