Skip to content

Instantly share code, notes, and snippets.

@mraiguo

mraiguo/videojs-contrib-add.html

Created September 29, 2018 09:05
Show Gist options
  • Save mraiguo/c140e4f65190bfca081d245fee04013f to your computer and use it in GitHub Desktop.
Save mraiguo/c140e4f65190bfca081d245fee04013f to your computer and use it in GitHub Desktop.
Download ZIP
videojs ads
Raw
videojs-contrib-add.html
<!DOCTYPE html>
<html>
<head>
<title>Video.js | HTML5 Video Player</title>
<script src="//libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<!-- Change URLs to wherever Video.js files will be hosted -->
<link href="//vjs.zencdn.net/6.2.5/video-js.css" rel="stylesheet" type="text/css">
<!-- video.js must be in the <head> for older IEs to work. -->
<script src="//vjs.zencdn.net/6.2.5/video.js"></script>
<script src="//cdn.jsdelivr.net/npm/videojs-flash@2/dist/videojs-flash.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/videojs.ads.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/videojs.ads.js"></script>
<!-- Unless using the CDN hosted version, update the URL to the Flash SWF -->
<script>
videojs.options.flash.swf = '//cdn.bootcss.com/videojs-swf/5.4.1/video-js.swf';
</script>
</head>
<body>
<video id="my-player-ads" class="video-js vjs-default-skin">
<source src="//os71std62.bkt.clouddn.com/ocean.mp4" type="video/mp4">
</video>
</body>
<script type="text/javascript">
var player = videojs("my-player-ads", {
width: 500,
height: 400,
controls: true,
autoplay: true,
techOrder: ['flash']
});
player.ads();
player.ready(function(){
player.ads.contentSrc="http://os71std62.bkt.clouddn.com/kitteh.mp4";
player.on('contentupdate', function(){
player.trigger('adsready');
});
player.on('readyforpreroll', function() {
player.ads.startLinearAdMode();
player.src('http://os71std62.bkt.clouddn.com/kitteh.mp4');
player.one('adended', function() {
player.ads.endLinearAdMode();
});
});
})
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment