<div class="video-ratio">
<video data-track-video="html5" poster="assets/vid/demo.jpg" controls loop data-title="The Roar of Digital Card" data-gacategory="video card">
<source src="assets/vid/demo.mp4" type="video/mp4" />
<object type="application/x-shockwave-flash" data="assets/swf/flowplayer-3.2.18.swf" width="640" height="360">
<param name="movie" value="assets/swf/flowplayer-3.2.18.swf" />
<param name="allowFullScreen" value="true" />
<param name="wmode" value="transparent" />
<param name="loop" value="true" />
<param name="flashVars" value="config={'playlist':['assets%2Fvid%2Fdemo.mp4',{'url':'assets%2Fvid%2Fdemo.jpg','autoPlay':false}]}" />
<img src="assets/vid/demo.jpg" width="640" height="360" title="No Flash found" />
</object>
</video>
</div>
.video-ratio {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
iframe, object, video, embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}
$(document).ready(function(){
$('[data-track-video="html5"]').trackVideo();
});
// Enabling Kissmetrics tracking
$(document).ready(function(){
$('[data-track-video="html5"]').trackVideo({
kissmetrics: true
});
});