音视频播放

音视频播放

audio标签用来向页面中引入一个外部的音频文件

 

音视频文件引入时默认情况下不允许用户自己控制播放停止

 

如何控制进度?

添加属性controls,会出现音频的进度条,可以控制音乐

属性autoplay 音频文件是否自动播放(火狐没有自动播放)、

如果设置了autoplay,则音乐在打开页面时会自动播放

(容易影响到用户体验,现在浏览器一般不会自动播放,播放过之后,再打开会自动播放

比如音量较大,突然打开网页,可能会吓一跳)

loop 音乐是否循环播放,音乐播放完之后,会重新播放

 

如何在不同浏览器中显示的一样并且兼容其他浏览器

比如播放器在不同的浏览器中显示不一样,就会有影响,可以通过css修改

如果浏览器不支持audio,可以通过使用source标签指定音频的路径

再添加提示 内容,

如果浏览器支持该标签,则显示音乐播放器

如果不支持该标签,则会显示提示的内容

有的浏览器不支持mp3文件,可以通过使用source指定多个音频路径

如果不支持第一个音频,则试下一个

一般都通过source引入

 兼容ie8播放器

使用embed可以在ie8中兼容

但是在其他游览器中显示的较丑

如果只想在ie8中显示ie8支持的播放器,在其他浏览器中显示默认的浏览器

 

引入视频文件

使用video标签网页中引入一个视频

兼容ie8和其他video一样

 

杂谈

音频视频占用空间较大

占用较大的磁盘空间和带宽,会花费不少成本

可以买专门存放视频和音频的服务器,相对本成本较小

获取外部连接,复制通用代码

可以通过使用css js对页面的美化

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值