html5移动端音乐播放器代码.zip资源-CSDN文库

共10个文件

js：5个

css：3个

ico：1个

jquery

需积分: 12 134 浏览量 2019-08-08 10:46:30 上传评论 2 收藏 93KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

html5移动端音乐播放器代码.zip （10个子文件）

alert

alert.css 2KB

alert.js 3KB

index.html 130KB

favicon.ico 21KB

loader.js 8KB

sition.js 7KB

jquery.min.js 84KB

music.js 10KB

css

bg.css 35KB

fcmusic.css 8KB

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>移动手势音乐播放</title> <meta name="keywords" content="封尘,lovefc,fc,个人原创,手势操作,移动播放器"/> <meta name="description" content="封尘,lovefc,fc,个人原创,手势操作,移动播放器"/> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <link rel="icon" href="favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">  <link href="css/bg.css?v=0.0.1" rel="stylesheet">  <link href="css/fcmusic.css?v=0.1.5" rel="stylesheet">  <link href="alert/alert.css" rel="stylesheet"> <script src="js/jquery.min.js"></script>  <script src="alert/alert.js" type="text/javascript" ></script>  <script src="js/sition.js?v=0.1.5" type="text/javascript" ></script> </head> <body>  <div id="scene" class="stars-wrapper"> <div data-depth="0.00" class="layer"></div> <div data-depth="0.30" class="stars-cluster stars-cluster-1"> <div class="star star-1"></div> <div class="star star-2"></div> <div class="star star-3"></div> <div class="star star-4"></div> <div class="star star-5"></div> <div class="star star-6"></div> <div class="star star-7"></div> <div class="star star-8"></div> <div class="star star-9"></div> <div class="star star-10"></div> <div class="star star-11"></div> <div class="star star-12"></div> <div class="star star-13"></div> <div class="star star-14"></div> <div class="star star-15"></div> <div class="star star-16"></div> <div class="star star-17"></div> <div class="star star-18"></div> <div class="star star-19"></div> <div class="star star-20"></div> <div class="star star-21"></div> <div class="star star-22"></div> <div class="star star-23"></div> <div class="star star-24"></div> <div class="star star-25"></div> <div class="star star-26"></div> <div class="star star-27"></div> <div class="star star-28"></div> <div class="star star-29"></div> <div class="star star-30"></div> <div class="star star-31"></div> <div class="star star-32"></div> <div class="star star-33"></div> <div class="star star-34"></div> <div class="star star-35"></div> <div class="star star-36"></div> <div class="star star-37"></div> <div class="star star-38"></div> <div class="star star-39"></div> <div class="star star-40"></div> </div> <div data-depth="0.50" class="stars-cluster stars-cluster-2"> <div class="star star-1"></div> <div class="star star-2"></div> <div class="star star-3"></div> <div class="star star-4"></div> <div class="star star-5"></div> <div class="star star-6"></div> <div class="star star-7"></div> <div class="star star-8"></div> <div class="star star-9"></div> <div class="star star-10"></div> <div class="star star-11"></div> <div class="star star-12"></div> <div class="star star-13"></div> <div class="star star-14"></div> <div class="star star-15"></div> <div class="star star-16"></div> <div class="star star-17"></div> <div class="star star-18"></div> <div class="star star-19"></div> <div class="star star-20"></div> <div class="star star-21"></div> <div class="star star-22"></div> <div class="star star-23"></div> <div class="star star-24"></div> <div class="star star-25"></div> <div class="star star-26"></div> <div class="star star-27"></div> <div class="star star-28"></div> <div class="star star-29"></div> <div class="star star-30"></div> <div class="star star-31"></div> <div class="star star-32"></div> <div class="star star-33"></div> <div class="star star-34"></div> <div class="star star-35"></div> <div class="star star-36"></div> <div class="star star-37"></div> <div class="star star-38"></div> <div class="star star-39"></div> <div class="star star-40"></div> </div> <div data-depth="0.90" class="stars-cluster stars-cluster-3"> <div class="star star-1"></div> <div class="star star-2"></div> <div class="star star-3"></div> <div class="star star-4"></div> <div class="star star-5"></div> <div class="star star-6"></div> <div class="star star-7"></div> <div class="star star-8"></div> <div class="star star-9"></div> <div class="star star-10"></div> <div class="star star-11"></div> <div class="star star-12"></div> <div class="star star-13"></div> <div class="star star-14"></div> <div class="star star-15"></div> </div> </div>   <div class="fcmusic"> <div class="items-group"> <div class="item active"> <div class="block" id="fcmusic"> <span class="circleLight"></span> <div class="text"> <span class="icon"> <img src="http://p2.music.126.net/WoR2LbM1IFauFpvhBWOjqA==/6642149743396577.jpg?param=300x300" id="round_icon" class="round_icon play-tx"></span> <span id="tools"> <i class="fa fa-backward play-left"></i> <i class="fa fa fa-play-circle play"></i> <i class="fa fa-forward play-right"></i> <br /><br /> <input type="range" name="PlayProgress" id="PlayProgress" value="0" onChange="PlayProgress(this.value)"> </span> <p class="songtext"> <b class="songname" id="lyctext"></b> </p> <div class="scale_panel"> <div class="scale" id="progressBar"> <div></div> <span id="progressBtn"></span> </div> </div> </div> </div> </div> </div> </div> <audio id="musicfc" style="width:0;height:0;display:none;"> <source src="http://m10.music.126.net/20181015011529/3885e2f93373ca79b3e92238a6a74182/ymusic/b95a/0f13/4f0a/0259b99b99fb5cd35099670bbbd535a3.mp3" crossOrigin="anonymous" type="audio/mpeg"> </audio>   <script src="js/loader.js"></script>  <script> var musicJson =[{"title":"\u5fc3\u505a\u3057\uff08Cover GUMI\uff09","author":"\u53cc\u7b19","pic":"https:\/\/p2.music.126.net\/uwF73BxhvWiR-Kxn0wGe0g==\/109951162927951204.jpg?param=200y200","url":"https:\/\/music.163.com\/song\/media\/outer\/url?id=478303470.mp3","lyc":"[by:love_hassy]\n[00:00.00] \u4f5c\u66f2 : \u8776\u3005P\n[00:00.580] \u4f5c\u8bcd : \u8776\u3005P\n[00:01.740]\u306d\u3047\u3082\u3057\u3082\n[00:03.900]\u5168\u3066\u6295\u3052\u6368\u3066\u3089\u308c\u305f\u3089\n[00:0

评论收藏

内容反馈