您的位置:首页 > Web前端 > JQuery

实现音乐播放器的代码(html5+css3+jquery)

2017-02-12 22:37 162 查看
看下面的效果图很不错吧,是怎么实现的呢?下面小编给大家分享下我的一番宝物,Lisa唱的 在angel beats的插曲。用到html5、css、jquery实现此音乐播放器。

一番宝物,Lisa唱的   在angel beats的插曲

最后在简述这个东西怎么写之前,本人男,24岁,籍贯上海,诚招女友一枚,要求:性格温顺。。。(省略500字)

?
html部分就这样略过了。。。。基本都会写。。。

?
css部分么主要挑点有趣的

大概么这么几个css3动画。。。。上面那个

复制代码代码如下:

.MusicPlayProcess.rotate

{ animation: rotate 30s infinite linear;}

你可以把这个30s改成歌曲时间长度就变成进度条了  O~HOHOHOHO(懒人总有懒办法)

infinite 么无限播放么你也懂得

复制代码代码如下:

.MusicPicName.pause{animation-play-state:paused;

-webkit-animation-play-state:paused;}

然后么暂停动画、、、、

兼容性是个硬伤其他没什么

?
这里是Jq部分

play么确定当前状态1播放0暂停

复制代码代码如下:

 $("audio").get(0).play();

$("audio").get(0).pause();
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: