给Dplayer添加前置广告视频,暂停广告与试看功能

CaiBao
57
文章
3
评论
2020年6月9日17:54:12 评论浏览:90 829字阅读2分45秒

在使用Dplayer播放视频时有时候,我们可能会用到视频的前置广告视频啥的,或是要先放个自个的品牌宣传视频,然后再进行播放正片.
今天就介绍下吧.
1,引入 <script src="//mat1.gtimg.com/libs/jquery/1.11.3/jquery.min.js"></script>,这个很重要
2,暂停贴片广告
3,前置视频贴片广告
4,前置HTML贴片广告
5,整合
给Dplayer添加前置广告视频,暂停广告与试看功能

暂停贴片广告

 

前置视频贴片广告

这里没做跳过广告,此处代码不能与下方前置HTML前置贴片共用,想要公共,自行调式修改下一些控制播放的地方就行

HTML部分,放在播放 <div id="video" ></div> 上方 , 且这一行最好隐藏即<div id="video" style="display:none;" ></div>

JS部分,放在var dp = new DPlayer({........}); 上方

前置贴片广告。

CSS部分:(这个主要是关闭按钮)

HTML部分,放在播放 <div id="video"></div> 上方

JS部分,dplayer播放器不要开启自动播放,即  autoplay:false,     (dplayer播放器默认即为false)

最后附上3种整合版

试看功能,自个研究:

文章转载自:https://www.h2sheji.com/art/dplayer-ad.html

展开全文
  • 版权声明: 发表于 2020年6月9日17:54:12
  • 转载注明:https://www.caibao.in/620
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: