优酷视频
前段时间做过一个视频的项目,嵌入的视频有腾讯,优酷和秒拍,因不同的视频源在网页中嵌入的方法不一样,所以总结一下分享给大家,希望对你有所帮助。
优酷视频
优酷视频我是用iframe做的,因为这样做兼容性会更好。优酷视频的视频连接是 http://player.youku.com/embed/ + 视频的id。这样拼出来的链接就可以直接拿到视频,然后将视频链接放到iframe的src中。
注意:优酷的视频在网页开发者手机模式下不能播放,但可以在手机和网页上可以播放,这点需要注意。
<iframe class="banner-video"
src="'http://player.youku.com/embed/'+videoId"
scrolling=no
frameborder=0
allowfullscreen="true"
webkitallowfullscreen="true"
效果图:
腾讯视频
腾讯的视频因他们自己做了一些处理,一般的做法页面嵌入iframe或者是video标签对腾讯视频不好使,为了达到更好的兼容,建议接入腾讯视频api。视频链接:https://v.qq.com/iframe/player.html?vid=r0025h6007x&tiny=0&auto=0
https://v.qq.com/iframe/player.html?vid= + 视频ID + &tiny=0&auto=0
<!--腾讯视频-->
<!--html-->
<p class="banner-video" id="video-content"></p>
<!--js-->
const video = new tvp.VideoInfo(); video.setVid('视频id');
const player = new tvp.Player();
player.create({
width: 400,
height: 300,
video: video,
modId: "video-content", /*dom id*/
clientbar: 0,
autoplay: 0,
pic: '缩略图src',
});
效果图:
如果想要添加其他的事件,详情可以查看腾讯视频文档。api文档链接
秒拍视频
秒拍视频相对简单可以直接嵌入video标签,而且兼容性很好
<video id="banner-video" controls src="视频链接.MP4"></video>
效果图:
以上就是我我做过得网页嵌入视频的方法,希望我的文档对你有所帮助,如有问题欢迎交流。
相关阅读
[size=4][media=x,610,463]http://v.youku.com/v_show/id_XMzE0NzMDY0.html[/media][/size] [size=4]回复可见密码[/size][size=4
1认证之后 有规则一个月发几的嘛?只能相关品类视频吗?规则~最好日更,我们是按播放量补贴,总而言之多“播放量”多得。真实
一段广告之后正片内容才正式开始,在互联网时代这种现象常见于优酷、爱奇艺等视频播放平台,是一种成熟的商业模式,同时也是网民们习以
autojs调用java的类库爬取bilibili视频弹幕内容,get请
/** * @功能 爬取指定bilibili视频弹幕 * @作者 家 * @感谢 内个谁, ProjectXero * @难点 不会解压gzip和deflate,再次感谢上
我不知道大家平时有没有在意自己的淘宝淘气值,其实淘宝淘气值高对大家有很多好处。那么今天小编就来给大家说说淘气值1000淘宝评价