Demos

Try some exmaples and your own streams.

Hls & Dash

Hls and MPEG Dash live stream & VOD demo.

Run demo
MP4 files

Legacy MP4 video playback.

Run demo
Time callback

onTime callback notification demo.

Run demo
Player callbacks

Playback callback functions notification demo.

Run demo
Custom layers / banners

Custom html layers in player.

Run demo
Video ads

Preroll video ads demo.

Run demo
Custom streams

Try your own Hls or Dash stream url.

Run demo

Configuration options

Full list of configuration options.

Option Type Default Description
autoplay Boolean false Play media automaticaly.
element jQuery object 
$('body')
 Video element to replace or lement to append new player instance.
debug Boolean false Output log in console.
aspectRatio Number 
0.5625
 Aspect ratio for player UI container size calculation. Aspect is calculated as height/width.
Default value comes from most common 16:9 aspect.
width Integer 
640
 Resolution breakpoint for none responsive layouts.
If responsive is true, this option is ignored and parent width is used instead.
errorRecoveryAttemptLimit Integer 3 Error recovery attemps (deprecated).
i18n Object 
{
    messages: { pluginError: 'Plugin error' },
    liveText: 'Live',
    settings: 'Settings',
    auto: 'Auto',
    video: 'Video quality',
    audio: 'Audio quality',
    audioTracks: 'Audio tracks',
    subtitles: 'Subtitles',
    speed: 'Playback speed',
    speedItems: [
    {
        active: 1,
        value: 0.25,
        title: '0.25x'
    },
    {
        active: 1,
        value: 0.5,
        title: '0.5x'
    },
    {
        active: 1,
        value: 1,
        title: 'Normal'
    },
    {
        active: 1,
        value: 1.5,
        title: '1.5x'
    },
    {
        active: 1,
        value: 2,
        title: '2x'
    },
    {
        active: 1,
        value: 2.5,
        title: '2.5x'
    },
    {
        active: 1,
        value: 3,
        title: '3x'
    }
    ],
    videoBitrateList: [],
    audioBitrateList: [],
    audioTracksList: [],
    textTracksList: [],
}
 Translation options.
muted Boolean false Initial mute option (overrides player cookie value).
pauseOnClick Boolean true Play/pause media on click in player area.
playbackDebug Boolean false Extended debug info (extreme verbose mode).
pluginMode Boolean false Embed dashifjs or hlsjs scripts automaticaly when needed.
plugins String 'julia-player/dist/js/lib' Path to dashifjs and hlsjs libraries.
responsive Boolean true Set player responsive resizing (based on parent element width).
skip Integer 5 Skip video when left/right arrow key is pressed (in seconds).
source Object 
{
    file: '',
    poster: '',
    link: '',
    mode: 'legacy',
    live: false,
}
 Source file definition, if video element is not used.
thumbs Boolean false Show thumbnails on timeline mouseover.
volume Integer -1 Initial volume (overrides player cookie value). Default player volume is 25 (25% when default -1 is set) or cookie last state setting.
zIndexStart Integer 1 CSS starting z-index for player object.
dashConfig Object 
{
    headers: {},
    queryString: {},
}
 Configuration for dashif library.
hlsConfig Object 
{ debug: false }
 Configuration for hlsjs library.

Callbacks

Full list of player callback functions.

Default value is false. You can use function or string to bind callback function. If you are using callback typeof string, function must be callable globally (window context).
Method Attached to event Description
onDurationChange durationChange Run function when media duration has been changed.
onFullscreen fullcreen Run function on player fullscreen.
onFullscreenExit fullscreenExit Run function on player fullscreen exit.
onInit init Run function when the player has been initilaized.
onModeSet modeSet Run function when the player plugin mode (legacy | dash | hls) has been set.
onPlay play Run function on player playback start.
onPause pause Run function on player pause.
onResize resize Run function when the player has been resized.
onSeek seek Run function on player seek video.
onStop stop Run function when the player has been stopped (video ended).
onSourceSet sourceSet Run function when the player media source has been set.
onTime not attached Run function when the player reach timestamp. This function is fired only once.
onTime value is not function but object based on human readable timestamps. 
{
    '00:02': functionName,
    '00:10': anotherFunctionName,
}
onTimeUpdate timeUpdate Run function when the player media position has been chnaged (seek or playback continues).
onVolumeChange volumeChange Run function when the player volume has been changed.

Download

Download from Github.

Download

If you like it, support it

Donation BTC address:

18kBKQSXVMGt4kTDy38r9MFrcifhPm4cqk

Transfer 0.005 BTC

Thank you.