wavesurfer+vue实现读取播放音乐展示可拖动进度的频谱效果代码-html代码-BFW代码库

wavesurfer+vue实现读取播放音乐展示可拖动进度的频谱效果代码

代码语言：html

所属分类：多媒体

代码描述：wavesurfer+vue实现读取播放音乐展示可拖动进度的频谱效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
  
<style>
.fa-circle-thin:before {
  content: "\f1db";
}
.btn-prev,
.btn-next,
.play-pause-btn {
  display: inline-block;
}
.fa-backward {
  margin-left: 0.4em;
  margin-top: 0.1em;
}
.fa-forward {
  margin-left: 0.6em;
  margin-top: 0.1em;
}
.fa-play {
  margin-left: 0.7em;
  margin-top: 0.1em;
}
.playlist .demo-song {
  background-color: #444444;
  color: #fff;
  padding: 1em;
}
.playlist .demo-song.active {
  background-color: #222222;
}
</style>


  
  
</head>

<body>
  

<div id="audio-demos-vuejs">
    <wavesurfer-player layout="modal"></wavesurfer-player>
</div>


<script type="text/x-template" id="player-template">
   <div class="player-template-rootnode">
        <div class="meta-artist">
            <span class="the-artist">.........完整代码请登录后点击上方下载按钮下载查看