Fun w/FlowPlayer & ad calls
by deanpeters
HTML
<script src="http://publishing.ramp.com/FileResource/widgets/metaplayer3/external/popcorn/popcorn.js"></script>
<link rel="stylesheet" href="http://publishing.ramp.com/FileResource/widgets/metaplayer3/build/mp2/theme.mp2.css">
<script src="http://publishing.ramp.com/FileResource/widgets/metaplayer3/build/metaplayer-complete.js"></script>
<script src="http://publishing.ramp.com/FileResource/widgets/metaplayer3/external/flowplayer/flowplayer-3.2.6.min.js"></script>
<h3>MetaPlayer » Examples » FlowPlayer with v3 UI</h3>
<div class="container">
<div id='target'></div>
<div id='searchbar'></div>
<div id='transcript'></div>
</div>
CSS
h3 {
color: #101010;
font-family: Helvetica, Arial, sans-serif;
margin: 20px;
font-size: 20px;
}
.container {
position: relative;
}
#target {
width: 600px;
height: 300px;
background: #333;
}
#transcript {
margin-top: 10px;
outline: 1px solid black;
width: 600px;
height: 100px;
}
#searchbar {
outline: 1px solid black;
width: 600px;
}
JavaScript
var fp, player;
$(function () {
fp = $f('target', {
src: "//publishing.ramp.com/FileResource/widgets/metaplayer3/external/flowplayer/flowplayer-3.2.7.swf",
wmode: "transparent"
}, {
clip: {
scaling: "fit"
},
playlist: []
});
//fp.ipad();
fp.load();
player = MetaPlayer(fp)
.controlbar({
fullscreen: true
})
.captionconfig()
.transcript("#transcript")
.searchbar("#searchbar")
.endcap()
.srt()
.mrss("//publishing.ramp.com/FileResource/widgets/metaplayer3/examples/data/elephants.mrss.xml")
.load();
});