相关API:wx.createVideoContext(string id, Object this)
controls:是否显示默认播放控件(播放/暂停按钮、播放进度、时间)
muted:是否静音
show-play-btn:是否显示视频底部控氏隐制栏的播放按钮
show-center-play-btn:是否显示视频中间的播放按钮祥枝
show-mute-btn:是否显示静音按钮
事歼宴厅件:
bindended:当播放到末尾时触发 ended 事件
接口:
wx.createVideoContext(string id, Object this)
https://gitee.com/susuhhhhhh/wxmini_demo
当 video 标签添加上 controls 属性时,页面上会显示出所有的控制组件。若有些组件不需要只需要在css中设置相关属性把它隐藏掉即可。<video
style="width:500pxheight:100%"厅梁
controls="controls"
扮差运autoplay
庆袜 poster="视频未加载时封面图片"
id="video"
></video>
//全屏按钮
video::-webkit-media-controls-fullscreen-button{
display: none
}
//播放按钮
video::-webkit-media-controls-play-button{
display: none
}
//进度条
video::-webkit-media-controls-timeline{
display: none
}
//观看的当前时间
video::-webkit-media-controls-current-time-display{
display: none
}
//剩余时间
video::-webkit-media-controls-time-remaining-display{
display: none
}
//音量按钮
video::-webkit-media-controls-mute-button{
display: none
}
video::-webkit-media-controls-toggle-closed-captions-button{
display: none
}
//音量的控制条
video::-webkit-media-controls-volume-slider{
display: none
}
//所有控件
video::-webkit-media-controls-enclosure{
display: none
}
html5为你的网页添加视频播放器
在html5中通过video标签为网页添加视频播放功能。
video元素支持三种视频格式:ogg,mpeg4,webm
Ogg=带有Theora视频编码和Vorbis音频编码的Ogg文件
MPEG4=带有H.264视频编码和AAC音频编码的MPEG4文件
WebM=带有VP8视频编码和Vorbis音频编码的WebM文件
以下是video标签的相关属性。
autoplayautoplay如果出现该属性,则视频在就绪后马上播放。
controlscontrols如果出现该属性,则向用户显示控件,比如播放祥余者按钮。
heightpixels设置视频播放器的高度。
looploop如果出现该属性,则当媒介文件完成播放后再次开始播放。
preloadpreload如果出现该属性,谨薯则视频在页面加载时进行加载,并预备播毁棚放。如果使用"autoplay",则忽略该属性。
srcurl要播放的视频的URL。
widthpixels设置视频播放器的宽度。下面是一个小实例:
<!DOVTYPEhtml>
<html>
<head>
<title>我爱学习</title>
</head>
<body>
<videocontrols="controls">
<sourcesrc="song.ogg"type="audio/ogg">
<sourcesrc="song.mp3"type="audio/mpeg">
Yourbrowserdoesnotsupporttheaudiotag.
</video>
</body>
</html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)