Flowplayer · Splash on finish

Splash image is shown after playback has ended

Often it is undesireable that the video 'hangs' on the last frame when finished. Unloading a player installed in a splash setup is not only a visual variant of a custom end screen, but also returns the player to its original state.

Compare with this demo.

<head/>

<style>

#black {
background-color: #000;
background-image: url(//flowplayer.org/media/img/demos/black_big.jpg);
}

CSS

<script>

// global configuration
flowplayer.conf = {
// splash setup required for unloading
splash: true,
rtmp: "rtmp://s3b78u0kbtx79q.cloudfront.net/cfx/st"
};
 
// all players go to splash state on finish
flowplayer(function (api) {
api.on("finish", function (e, api) {
api.unload();
});
});
 

window.onload = function () {
flowplayer("#black", {
ratio: 25/47,
clip: {
sources: [
{ type: "video/webm", src: "//edge.flowplayer.org/black/470x250.webm" },
{ type: "video/mp4", src: "//edge.flowplayer.org/black/470x250.mp4" },
{ type: "video/flash", src: "mp4:black/470x250" }
]
}
});
};

JavaScript

<body/>

<div id="black" class="fp-minimal is-closeable no-volume"></div>

HTML