简洁的HTML5音乐播放器可支持自适应全终端

 所属分类:音乐视频

 浏览:807次-  下载:1次-  评论: 0次-  更新时间:2020-10-06

简洁的HTML5音乐播放器可支持自适应全终端

引入所需文件

<link rel="stylesheet" href="css/audio-player.css" />
<script>
    (function (doc) {
        var addEvent = 'addEventListener',
            type = 'gesturestart',
            qsa = 'querySelectorAll',
            scales = [1, 1],
            meta = qsa in doc ? doc[qsa]('meta[name=viewport]') : [];

        function fix() {
            meta.content = 'width=device-width,minimum-scale=' + scales[0] + ',maximum-scale=' + scales[1];
            doc.removeEventListener(type, fix, true);
        }
        if ((meta = meta[meta.length - 1]) && addEvent in doc) {
            fix();
            scales = [.25, 1.6];
            doc[addEvent](type, fix, true);
        }
    }(document));
</script>
<!-- 以上内容需要引入在网站顶部 head 部分内即可 -->
<script src="js/jquery.min.js"></script>
<script src="js/audio-player.js"></script>
<script>
    $(function () {
        $('audio').audioPlayer();
    });
</script>
<!-- 以上内容需要引入在网站底部,不能放在播放器代码前面,否则不生效 -->

播放器:

<audio src="t.mp3" preload="auto" controls></audio>


金币说明:注册即送10金币,每日签到可获得更多金币,成为VIP会员可免金币下载! 充值金币充值会员更多说明»
描述:简洁的HTML5音乐播放器可支持自适应全终端
 标签: 音乐播放器

文件目录结构

  • ┝ www.zzsucai.com.txt
  • css
      • ┝ audio-player.css
  • js
      • ┝ jquery-3.5.1.min.js
      • ┝ audio-player.js
      • ┝ jquery.min.js
  • ┝ index.html
  • ┝ .url
  • ┝ t.mp3

相关素材

讨论这个素材(0)回答他人问题或分享使用心得奖励金币

〒_〒 居然一个评论都没有……

表情  文明上网,理性发言!
我的金币余额: 0 已下载次数: 1
所需金币:12开始下载

金币获取:签到、评论、投搞、充值、发帖、回帖    » 在线充值(10金币=1元)