api悬浮音乐播放器
生活随笔
收集整理的這篇文章主要介紹了
api悬浮音乐播放器
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
疫情期間閑的沒事搭建了博客,在扒殼的時候又發現這個懸浮音樂播放器不錯,然而又尋思著把播放器也同時給拿下,都怪手癢,請原始作者見諒。廢話不多說先上圖吧!
效果圖:
?
1.0 版本詳情:
此懸浮播放器已經整合至博客站點里管理方便。目前功能如下
1、在http://4dn.net/?user&player博客里直接創建懸浮播放器
2、添加分類 添加音樂 修改音樂 修改播放器參數
3、播放器參數包括;選擇歌單 自動播放?播放模式?顯示名稱?站點名稱?歡迎語句??模糊背景?飄動音符?默認音量?默認專輯?顯示歌詞??幾秒彈出
4、快速添加音樂:新增網易 百度 快速一鍵添加 如
網易地址:
https://music.163.com/#/song?id=1411358329
百度地址:
http://music.taihe.com/song/931772
5、此播放器還在預熱中有任何問題請大家留言,下面的留言板空著太丑了,需要老鐵們的腳印,感謝大家的支持!謝謝。
代碼:
<script id="4dn" language="javascript" src="http://player.4dn.net/js/player.js" key="4496c3baad855"></script> <link href="http://player.4dn.net/style/player.css" rel="stylesheet" type="text/css" />'."\n"; <div id="wenkmPlayer"><div class="player"><div class="blur-img"><img src="" class="blur" /></div><div class="infos"><div class="songstyle"><i class="fa fa-music"></i> <span class="song"></span></div><div class="timestyle"><i class="fa fa-clock-o"></i> <span class="time">00:00 / 00:00</span></div><div class="artiststyle"><i class="fa fa-user"></i> <span class="artist"></span><span class="moshi"><i class="loop fa fa-retweet current"></i> 順序播放</span></div><div class="artiststyle"><i class="fa fa-folder"></i> <span class="artist1"></span><span class="geci"></span></div></div><div class="cover_wrap"><div class="cover"></div><div class="status"><b><i class="play fa fa-play-circle" title="播放"></i><i class="pause fa fa-pause-circle" title="暫停"></i></b><div id="pdyf1" class="note"><i class="fa fa-music" aria-hidden="true"></i></div> <div id="pdyf2" class="note"><i class="fa fa-music" aria-hidden="true"></i></div> <div id="pdyf3" class="note"><i class="fa fa-music" aria-hidden="true"></i></div><div id="pdyf4" class="note"><i class="fa fa-music" aria-hidden="true"></i></div><div id="pdyf5" class="note"><i class="fa fa-music" aria-hidden="true"></i></div></div></div><div class="control"><i class="loop fa fa-retweet" title="順序播放"></i><i class="prev fa fa-backward" title="上一首"></i><i class="next fa fa-forward" title="下一首"></i><i class="random fa fa-random" title="隨機播放"></i></div><div class="bottom"><div class="playprogress"><div class="progressbg"><div class="progressbg1"></div><div class="progressbg2"></div><div class="ts"></div></div></div><ul class="bottomright"><li class="volumecontrol"><i class="volume fa fa-volume-up" title="音量"></i><div class="volumeprogress"><div class="progressbg"><div class="progressbg1"></div><div class="ts"></div></div></div></li><li class="switch-ksclrc" style="display: list-item;"><i class="fa fa-toggle-on"></i></li><li class="switch-playlist"><i class="fa fa-list-ul" title="播放列表" mytooltip="播放列表"></i></li></ul><div style="clear:both"></div></div></div><div class="playlist"><div class="playlist-bd"><div class="album-list"><div class="header"></div><div class="list"></div></div><div class="song-list"><div class="header"><i class="fa fa-angle-right"></i><span></span></div><div class="list"><ul></ul></div></div></div></div><div class="switch-player"><i class="fa fa-angle-right" style="margin-top: 20px;"></i></div> </div> <div id="wenkmTips"></div> <div id="wenkmLrc"></div> <div id="wenkmKsc"></div>總結
以上是生活随笔為你收集整理的api悬浮音乐播放器的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 怎么知道电脑和打印机是否连接正常
- 下一篇: spring-security验证登录h