
JWPlayer 6.4 RTMP streaming with Fancybox and HTML5 fallback
A while back I was trying to get this to work with shadowbox, but kept failing. I have since found a solution that uses Fancybox instead. It's even possible to use custom parameters on *both* the longtail player (e.g., dynamic streaming) and fancybox (e.g., open effects) scripts. Also, this embed falls back great on iphone and ipad.
At any rate I thought this code block would help someone down the road.
bc.. <script type="text/javascript">
jQuery(window).load(function() {
jQuery("a.fancybox").fancybox({
'content':'<div id="videospace">Loading the Video...</div>',
maxWidth : '100%',
maxHeight : '100%',
fitToView : true,
width : '100%',
height : '100%',
autoSize : true,
closeBtn : false,
openEffect : 'fade',
closeEffect : 'fade',
padding : 0,
scrolling : 'no',
autoDimensions : true,
helpers : {
closeClick : true,
title : {
type : 'outside'
},
overlay : {
locked : false,
css : {
'background' : 'rgba(40, 33, 33, 0.80)'
}
}
},
afterShow: function() {
jwplayer('videospace').setup({
playlist: [{
image: "http://www.example.com/cover-image.jpg",
sources: [{
file: "rtmp://www.example.com/application/mp4:myVideo.mp4"
},{
file: "http://www.example.com/myVideo.mp4"
}]
}],
height: 528,
primary: "flash",
autostart: true,
width: 900
});
}
});
});
</script>
Here's a page where we have it working: http://www.rockbrookcamp.com/describe/camp-videos/