资讯专栏INFORMATION COLUMN

Native Audio and Native Video

malakashi / 3286人阅读

摘要:之前,在网页中实现音频和视频的播放功能需要借助第三方插件,如来实现。而在中,提供了和元素,使用起来更加方便。

HTML5之前,在网页中实现音频和视频的播放功能需要借助第三方插件,如Adobe Flash来实现。而在HTML5中,提供了audio和video元素,使用起来更加方便。

Audio

Audio元素

方法一:

方法二:
 

创建Audio对象

方法一:
var audio = new Audio();
方法二:
var audio = document.createElement("audio");

访问Audio对象


var audio = document.getElementById("music-audio");
属性 描述
duration 音频的长度(以秒计)
ended 音频的播放是否已结束
error 表示音频错误状态的 MediaError 对象
loop 设置或返回音频是否应在结束时再次播放
paused 设置或返回音频是否暂停
played 返回表示音频已播放部分的 TimeRanges 对象
preload 设置或返回音频的 preload 属性的值
volume 设置或返回音频的音量
muted 设置或返回是否关闭声音
方法 描述
play() 开始播放音频
pause() 暂停当前播放的音频
音频支持类型:.acc, .mp3, .ogg, .wav, .webm
preload 预加载
    ● auto - 当页面加载后载入整个音频
    ● metadata - 当页面加载后只载入元数据
    ● none - 当页面加载后不载入音频
Video

Video元素

方法一:

方法二:
 

创建Video对象

var video = document.createElement("video");

访问Video对象


var video = document.getElementById("movie-video");
属性 描述
width 设置视频播放器的宽度
height 设置视频播放器的高度
duration 视频的长度(以秒计)
ended 视频的播放是否已结束
error 表示视频错误状态的 MediaError 对象
loop 设置或返回视频是否应在结束时再次播放
paused 设置或返回视频是否暂停
played 返回表示视频已播放部分的 TimeRanges 对象
preload 设置或返回视频的 preload 属性的值
muted 设置或返回是否关闭声音
poster 规定视频下载时显示的图像,或者在用户点击播放按钮前显示的图像
方法 描述
play() 开始播放视频
pause() 暂停当前播放的视频
preload 预加载
    ● auto - 当页面加载后载入整个视频
    ● metadata - 当页面加载后只载入元数据
    ● none - 当页面加载后不载入视频

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/50659.html

相关文章

  • Native Audio and Native Video

    摘要:之前,在网页中实现音频和视频的播放功能需要借助第三方插件,如来实现。而在中,提供了和元素,使用起来更加方便。 HTML5之前,在网页中实现音频和视频的播放功能需要借助第三方插件,如Adobe Flash来实现。而在HTML5中,提供了audio和video元素,使用起来更加方便。 Audio Audio元素 方法一: music audio 方法二: music audio ...

    rollback 评论0 收藏0
  • android ijkplayer c层分析-初始化(续1 java层与c层衔接)

    摘要:初始化的过程上一篇其实并未完全分析完,这回接着来。层的函数中,最后还有的调用,走的是层的。结构体如下的和,以及,其余是状态及的内容。整个过程是个异步的过程,并不阻塞。至于的东西,都是在层创建并填充的。 初始化的过程上一篇其实并未完全分析完,这回接着来。java层的initPlayer函数中,最后还有native_setup的调用,走的是c层的IjkMediaPlayer_native_...

    Olivia 评论0 收藏0
  • audio/video 在ios兼容性问题总结

    摘要:的兼容性问题,先来个五颜六色的图看看在哪里问题描述的安全机制,系统自带浏览器不能自动播放尝试方案回调中执行等定时器回调执行回调借用,如微信的监听事件,进行体验不好分析所以猜测如果限制引擎层判断是否是队列,中回调之类。。。 【1】audio autoplay的兼容性问题,先来个五颜六色的图看看Audio在哪里?showImg(https://segmentfault.com/img/bV...

    ACb0y 评论0 收藏0

发表评论

0条评论

malakashi

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<