audio元素的属性、方法与事件

1、canPlayType()：检测浏览器是否支持音频类型，返回值

[上传失败(image-1bb6b0-1543301687426)]

2、load()：重新加载音频，用于更改src之后使用，无参数，无返回值

3、play()：播放音频，无参数，返回一个promise

4、pause()：暂停音频，无参数，无返回值

1、buffered

[上传失败(image-ef571a-1543301687426)]

2、currentSrc：返回当前音频的URL
3、currentTime：返回当前音频的现在时间

[上传失败(image-e3da20-1543301687426)]

4、ended：音频是否结束
5、duration：返回音频时长，以秒计
6、networkState：返回音频的网络状态

7、paused：是否处于暂停状态

[上传失败(image-d7aedc-1543301687426)]

8、played

9、readyState：音频当前状态

10、seekable：返回可寻址的时间范围

[上传失败(image-f8f658-1543301687426)]

11、seeking：用户是否在寻址

[上传失败(image-261d4-1543301687424)]

1、autoplay：是否自动播放，默认为false

2、constrols：是否显示控件，默认为false

3、currentTime：音频当前播放位置，以秒计

4、defaultMuted：初始是否静音，默认为false

5、muted：是否静音，默认为false

6、defaultPlaybackRate：默认播放速度

7、playbackRate：播放速度

8、loop：是否循环播放，默认为false

9、preload：是否在页面加载后立即加载

10、src：地址源

11、volume：音量，范围0-1

1、加载时触发

2、加载出错时触发

3、改变状态触发

4、总结以上开发常用事件

使用Audio()构造函数可以构造一个audio实例

css3中的动画属性如果能够好好的使用，可以写出很多优美的动画

有两个值，默认为normal。意为一个动画结束之后，下一个动画周期从头开始接着动画播放。
另外一个值为alternate，意为动画结束之后，下一个动画周期从尾到头播放，再从头到尾播放。

paused 暂停
running 运行

html如下：

CSS如下：

使用来表示 translateY 的值与 时间 的关系:
横轴为表示 时间 ，为 0 时表示动画开始的时间，也就是向 box 加上 on 类名的时间，横轴一格表示 05s
纵轴表示translateY的值，为 0 时表示 translateY的值为 0，纵轴一格表示 50px

html如下：

css如下：

将animation的animation-duration这个属性值设置为0就可以了。具体的你可以看一下这里>