代码扒自http://www.wuover.com（百家网络博客）
核心代码
1、Javascript 代码
<code>
(function() {
XMLHttpData()
})();
0 >= String(window.location).indexOf("www.wuover.com") && (window.location = "http://www.wuover.com");
function XMLHttpData() {
var xmlhttp, song;
loadXMLDoc("http://www.wuover.com/wp-content/themes/QIUYE/music/song.json");
function loadXMLDoc(url) {
xmlhttp = null;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest()
} else if (window.ActiveXObject) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")
}
if (xmlhttp != null) {
xmlhttp.onreadystatechange = getXMLHttpData;
xmlhttp.open("get", url, true);
xmlhttp.send(null)
} else {
alert("您的浏览器不支持 XMLHTTP")
}
}
function getXMLHttpData() {
if (xmlhttp.readyState === 4) {
if (xmlhttp.status === 0 || xmlhttp.status === 200) {
song = eval("(" + xmlhttp.responseText + ")");
formatPlayer(song)
} else {
alert("XMLHTTP 错误，请刷新浏览器")
}
}
}
}
function formatPlayer(song) {
var mEngine = new MUSICENGINE(song),
mPlay = document.getElementById("musicEngine"),
mPlayerSwitch = document.getElementById("musicPlayerSwitch"),
play = document.getElementById("play"),
pause = document.getElementById("pause"),
next = document.getElementById("next"),
prev = document.getElementById("prev"),
nowVolume = document.getElementById("nowVolume"),
nowMute = document.getElementById("nowMute"),
volume = document.getElementById("volume"),
mute = document.getElementById("mute"),
volumeSizeBg = document.getElementById("volumeSizeBg"),
progressRateBg = document.getElementById("progressRateBg"),
lyrics = document.getElementById("lyrics"),
albumLists = document.getElementById("albumLists");
mPlayerSwitch.onclick = function() {
musicPlayerSwitch()
};
play.onclick = function() {
mEngine.toPlay("play")
};
pause.onclick = function() {
mEngine.toPlay("pause")
};
next.onclick = function() {
if (mPlay.src != "") {
mEngine.next()
}
};
prev.onclick = function() {
if (mPlay.src != "") {
mEngine.prev()
}
};
nowVolume.onclick = function() {
mEngine.volume("on")
};
nowMute.onclick = function() {
mEngine.volume("off")
};
volume.onclick = function() {
mEngine.volume("on")
};
mute.onclick = function() {
mEngine.volume("off")
};
volumeSizeBg.onclick = function(event) {
var realVolume = VolumeChangeProcess(event);
mEngine.volumeControlStrip(realVolume)
};
progressRateBg.onclick = function(event) {
if (mPlay.src != "") {
var activeProgress = getSongProgress(event);
mEngine.songProgressAdjust(activeProgress)
} else {
return false
}
};
albumLists.onclick = function() {
mEngine.albumLists()
};
document.getElementsByTagName("body")[0].onclick = function(event) {
var o = event ? event: window.event;
if (o.target.id === "closeList") {
closeList();
return false
}
if (o.target.id === "cutoverList") {
if (o.target.innerHTML === "返回") {
document.getElementById("albumLists").click();
document.getElementById("albumLists").click();
mEngine.formatAlbumLists();
return false
}
if (o.target.innerHTML === "专辑列表") {
document.getElementById("albumLists").click();
mEngine.formatAlbumLists();
return false
}
if (o.target.innerHTML === "查看全部歌曲") {
mEngine.formatAllSongLists();
return false
}
}
if (o.target.parentNode) {
if (o.target.parentNode.className === "s-l") {
var musicIndex = mEngine.muiscIndexAndAlbumIndex(o.target.parentNode);
mEngine.playIndex(musicIndex.albumIndex, musicIndex.songIndex);
currentlyPlayingSong();
return false
}
}
if (o.target.className === "play-btn") {
o.target.parentNode.parentNode.ondblclick();
document.getElementById("listWrap").childNodes[0].childNodes[0].click();
return false
}
if (o.target.className === "play-icon") {
o.target.parentNode.parentNode.parentNode.ondblclick();
document.getElementById("listWrap").childNodes[0].childNodes[0].click();
return false
}
};
lyrics.onclick = function() {
lrcBoxSwitch()
};
lyrics.click();
}
function MUSICENGINE(song) {
var musicEngine = document.createElement("audio");
musicEngine.id = "musicEngine";
document.getElementById("musicPlayerWrap").appendChild(musicEngine);
this.song = song;
this.musicPlayer = document.getElementById("musicEngine");
this.musicPlayer.addEventListener("canplaythrough",
function() {
hide(document.getElementById("loadLrc"))
})
}
MUSICENGINE.prototype.toPlay = function(toPlay) {
var play = document.getElementById("play"),
pause = document.getElementById("pause");
if (this.musicPlayer.src === "") {
this.playIndex(0, 0)
}
if (toPlay === "play") {
this.musicPlayer.play();
this.playbackProgress("play");
hide(play);
show(pause)
}
if (toPlay === "pause") {
this.musicPlayer.pause();
this.playbackProgress("pause");
show(play);
hide(pause)
}
};
MUSICENGINE.prototype.next = function() {
var mode = document.getElementById("nowPlayManner").title;
this.songPlayMode("next", mode)
};
MUSICENGINE.prototype.prev = function() {
var mode = document.getElementById("nowPlayManner").title;
this.songPlayMode("prev", mode)
};
MUSICENGINE.prototype.volume = function(muteSwitch) {
var volumeSizeColor = document.getElementById("volumeSizeColor"),
volumeSizeSave = parseInt(volumeSizeColor.style.height);
if (muteSwitch === "on") {
volumeSizeColor.attributes["data-volume"].nodeValue = this.musicPlayer.volume;
volumeSizeColor.attributes["data-height"].nodeValue = volumeSizeSave;
this.musicPlayer.volume = 0.0;
volumeIconSwitch("on");
volumeSize(100)
}
if (muteSwitch === "off") {
this.musicPlayer.volume = volumeSizeColor.attributes["data-volume"].nodeValue;
volumeIconSwitch("off");
volumeSize(volumeSizeColor.attributes["data-height"].nodeValue)
}
};
MUSICENGINE.prototype.volumeControlStrip = function(realVolume) {
this.musicPlayer.volume = realVolume;
if (realVolume > 0) {
volumeIconSwitch("off")
} else {
volumeIconSwitch("on")
}
};
function VolumeChangeProcess(event) {
var volumeSizeBg = document.getElementById("volumeSizeBg"),
progressBP,
realVolume;
var coord = coordinate(event),
offsetCoord_Y = coord.coord_Y;
progressBP = progressBarPercentage(48, offsetCoord_Y);
volumeSize(progressBP);
realVolume = parseInt((100 - progressBP) / 10) / 10;
return realVolume
}
function volumeIconSwitch(muteSwitch) {
var nowVolume = document.getElementById("nowVolume"),
nowMute = document.getElementById("nowMute"),
volume = document.getElementById("volume"),
mute = document.getElementById("mute"),
volumeSizeColor = document.getElementById("volumeSizeColor");
if (muteSwitch === "on") {
hide(nowVolume);
show(nowMute);
hide(volume);
show(mute);
volumeSizeColor.style.height = "100%"
}
if (muteSwitch === "off") {
hide(nowMute);
show(nowVolume);
hide(mute);
show(volume)
}
}
function volumeSize(size) {
var volumeSizeColor = document.getElementById("volumeSizeColor");
volumeSizeColor.style.height = size + "%"
} (function() {
var nowVolume = document.getElementById("nowVolume"),
nowMute = document.getElementById("nowMute"),
volumeControl = document.getElementById("volumeControl");
nowVolume.onmouseover = function() {
show(volumeControl)
};
nowMute.onmouseover = function() {
show(volumeControl)
};
volumeControl.onmouseout = function(event) {
var Event = event || window.event;
if (Event) {
if (volumeControl.contains(Event.relatedTarget || Event.toElement)) {
return false
} else {
hide(volumeControl)
}
}
}
})();
MUSICENGINE.prototype.playbackProgress = function(playSwitch) {
var progressRateColor = document.getElementById("progressRateColor"),
songSchedule = 0,
timeall,
currenttime,
timer;
if (playSwitch === "play") {
timer = setInterval(function() {
var mPlayer = document.getElementById("musicEngine");
var mmWidth = document.all.progressRateBg.offsetWidth;
timeall = timeAll();
currenttime = currentTime();
lrcMove(timeall, currenttime);
songPlaybackTime(timeall, currenttime);
songSchedule = (currenttime / timeall) * mmWidth;
progressRateColor.style.width = songSchedule + "px";
if (mPlayer.ended) {
clearInterval(timer);
progressRateColor.style.width = 0;
if (document.getElementById("nowPlayManner").title === "单曲循环") {
mPlayer.currentTime = 0;
mPlayer.play()
} else {
document.getElementById("next").click()
}
}
},
1000)
}
if (playSwitch === "pause") {
clearInterval(timer)
}
};
MUSICENGINE.prototype.songProgressAdjust = function(time) {
this.musicPlayer.currentTime = time;
lrcAtuoMove(time)
};
function getSongProgress(event) {
var progressRateBg = document.getElementById("progressRateBg"),
mplayer = document.getElementById("musicEngine"),
progressBP,
SongProgress;
var coord = coordinate(event),
offsetCoord_X = coord.coord_X;
songScheduleChange(offsetCoord_X);
progressBP = progressBarPercentage(262, offsetCoord_X) / 100;
SongProgress = progressBP * mplayer.duration;
return SongProgress
}
function songScheduleChange(size) {
var progressRateColor = document.getElementById("progressRateColor");
progressRateColor.style.width = size + "px"
}
function timeAll() {
var mPlayer = document.getElementById("musicEngine");
if (mPlayer.currentTime != 0) {
return mPlayer.duration
} else {
return 0
}
}
function currentTime() {
var mPlayer = document.getElementById("musicEngine");
return mPlayer.currentTime
}
function songPlaybackTime(timeall, currenttime) {
var playTime = document.getElementById("playTime"),
surplusTime = document.getElementById("surplusTime"),
leftTime,
rightTime;
if (currenttime < timeall) {
leftTime = parseInt(currenttime);
rightTime = parseInt(timeall - currenttime);
playTime.innerHTML = conversionTime(leftTime);
surplusTime.innerHTML = "-" + conversionTime(rightTime)
} else {
playTime.innerHTML = "0:00";
surplusTime.innerHTML = "-0:00"
}
}
function conversionTime(time) {
var surplusMinite, surplusSecond, cTime;
surplusMinite = Math.floor((time / 60) % 60);
surplusSecond = Math.floor(time % 60);
if (surplusSecond < 10) {
surplusSecond = "0" + surplusSecond
}
cTime = surplusMinite + ":" + surplusSecond;
return cTime
}
MUSICENGINE.prototype.albumLists = function() {
innerMusicList();
var musicList = document.getElementById("musicList"),
albumLists = document.getElementById("albumLists"),
listWrap = document.getElementById("listWrap"),
listName = document.getElementById("listName"),
cutoverList = document.getElementById("cutoverList");
if (albumLists.title === "打开专辑列表") {
closeList();
removeClass(musicList, "hidden");
listWrap.className = "list-wrap album";
listName.innerHTML = "专辑列表";
cutoverList.innerHTML = "查看全部歌曲";
cutoverList.className = "cutover-list";
addClass(albumLists, "album-lists-hover");
albumLists.title = "关闭专辑列表";
this.formatAlbumLists()
} else {
if (albumLists.title === "关闭专辑列表") {
closeList()
}
}
};
MUSICENGINE.prototype.formatAlbumLists = function() {
var song = this.song,
listWrap = document.getElementById("listWrap"),
albumNum = song.songData.length,
html = "";
for (var i = 0; i < albumNum; i++) {
html += "<li class=\"s-l\">";
html += "<img src=\"" + song.songData[i].albumCoverMax + "\" class=\"album-cover\">";
html += "<span class=\"album-name\" title=\"" + song.songData[i].albumName + "\"><span class=\"speaker\"></span><span class=\"s-a\">" + song.songData[i].albumName + "</span></span>";
html += "<div class=\"album-cover-hover hidden\">";
html += "<div class=\"mask\" title=\"双击打开\"></div>";
html += "<span class=\"album-song-num\" title=\"" + song.songData[i].albumSong.length + "首歌曲\">" + song.songData[i].albumSong.length + "</span>";
html += "<div class=\"play-btn\" title=\"播放专辑：" + song.songData[i].albumName + "\"><div class=\"play-icon\"></div>播放专辑</div>";
html += "</div>";
html += "</li>"
}
listWrap.innerHTML = html;
for (var m = 0; m < listWrap.getElementsByTagName("li").length; m++) {
var dom = listWrap.getElementsByTagName("li")[m];
dom.onmouseover = function() {
show(this.childNodes[2])
};
dom.onmouseout = function(event) {
var Event = event || window.event;
if (Event) {
if (dom.contains(Event.relatedTarget || Event.toElement)) {
return false
} else {
hide(this.childNodes[2])
}
}
};
dom.ondblclick = function() {
formatInAlbumLists(song, this.childNodes[1].childNodes[1].innerHTML)
}
}
currentlyPlayingSong()
};
MUSICENGINE.prototype.formatAllSongLists = function() {
var song = this.song,
listWrap = document.getElementById("listWrap"),
cutoverList = document.getElementById("cutoverList"),
albumNum = song.songData.length,
albumSongNum,
html = "";
for (var i = 0; i < albumNum; i++) {
albumSongNum = song.songData[i].albumSong.length;
for (var j = 0; j < albumSongNum; j++) {
html += "<li class=\"s-l\">";
html += "<span class=\"s-name\" title=\"" + song.songData[i].albumSong[j].musicName + "\">" + song.songData[i].albumSong[j].musicName + "</span>";
html += "<span class=\"s-album\" title=\"" + song.songData[i].albumName + "\">" + song.songData[i].albumName + "</span>";
html += "<span class=\"s-time\">" + song.songData[i].albumSong[j].musicTime + "</span>";
html += "<div name=\"addFavorites\" class=\"add-favorites hidden\" title=\"喜欢\"></div>";
html += "</li>"
}
}
listWrap.className = "list-wrap song";
listWrap.attributes["data-temp"].nodeValue = "0";
cutoverList.innerHTML = "返回";
cutoverList.className = "cutover-list";
listWrap.innerHTML = html;
currentlyPlayingSong()
};
MUSICENGINE.prototype.updatePlaylist = function() {
var listWrap = document.getElementById("listWrap"),
song = this.song,
nextAlbumSong = song.songData[this.albumIndex].albumSong.length,
html = "";
if (hasClass(listWrap, "song") && listWrap.attributes["data-temp"].nodeValue === "1") {
for (var j = 0; j < nextAlbumSong; j++) {
html += "<li class=\"s-l\">";
html += "<span class=\"s-name\" title=\"" + song.songData[this.albumIndex].albumSong[j].musicName + "\">" + song.songData[this.albumIndex].albumSong[j].musicName + "</span>";
html += "<span class=\"s-album\" title=\"" + song.songData[this.albumIndex].albumName + "\">" + song.songData[this.albumIndex].albumName + "</span>";
html += "<span class=\"s-time\">" + song.songData[this.albumIndex].albumSong[j].musicTime + "</span>";
html += "<div name=\"addFavorites\" class=\"add-favorites hidden\" title=\"喜欢\"></div>";
html += "</li>"
}
listWrap.innerHTML = html
}
};
function formatInAlbumLists(song, AlbumName) {
var listWrap = document.getElementById("listWrap"),
cutoverList = document.getElementById("cutoverList"),
albumNum = song.songData.length,
albumSongNum,
html = "";
for (var i = 0; i < albumNum; i++) {
if (song.songData[i].albumName === AlbumName) {
albumSongNum = song.songData[i].albumSong.length;
for (var j = 0; j < albumSongNum; j++) {
html += "<li class=\"s-l\">";
html += "<span class=\"s-name\" title=\"" + song.songData[i].albumSong[j].musicName + "\">" + song.songData[i].albumSong[j].musicName + "</span>";
html += "<span class=\"s-album\" title=\"" + song.songData[i].albumName + "\">" + song.songData[i].albumName + "</span>";
html += "<span class=\"s-time\">" + song.songData[i].albumSong[j].musicTime + "</span>";
html += "<div name=\"addFavorites\" class=\"add-favorites hidden\" title=\"喜欢\"></div>";
html += "</li>"
}
}
}
listWrap.className = "list-wrap song";
listWrap.attributes["data-temp"].nodeValue = "1";
cutoverList.innerHTML = "返回";
cutoverList.className = "cutover-list";
listWrap.innerHTML = html;
currentlyPlayingSong()
}
function closeList() {
var musicList = document.getElementById("musicList"),
albumLists = document.getElementById("albumLists"),
listWrap = document.getElementById("listWrap");
addClass(musicList, "hidden");
removeClass(albumLists, "album-lists-hover");
albumLists.title = "打开专辑列表";
listWrap.className = "list-wrap"
}
function innerMusicList() {
if (!document.getElementById("musicList")) {
var musicListDom = document.createElement("div");
musicListDom.id = "musicList";
musicListDom.className = "music-list hidden";
document.getElementsByTagName("body")[0].appendChild(musicListDom);
var html = "";
html += "<div class=\"list-title\">";
html += "<strong id=\"listName\"></strong>";
html += "<span id=\"cutoverList\" class=\"cutover-list hidden\"></span>";
html += "<div id=\"closeList\" class=\"close-list\" title=\"关闭列表\"></div>";
html += "</div>";
html += "<ul id=\"listWrap\" class=\"list-wrap\" data-temp=\"\"></ul>";
document.getElementById("musicList").innerHTML = "";
document.getElementById("musicList").innerHTML = html
}
}
function currentlyPlayingSong() {
var list = document.getElementById("listWrap"),
indexMusicName = document.getElementById("musicName").innerHTML,
indexAlbumName = document.getElementById("albumName").innerHTML;
for (var i = 0; i < list.childNodes.length; i++) {
for (var j = 0; j < list.childNodes.length; j++) {
removeClass(list.childNodes[j], "playIng")
}
if (hasClass(list, "song")) {
if (list.childNodes[i].childNodes[0].innerHTML === indexMusicName) {
addClass(list.childNodes[i], "playIng");
break
}
}
if (hasClass(list, "album")) {
if (list.childNodes[i].childNodes[1].childNodes[1].innerHTML === indexAlbumName) {
addClass(list.childNodes[i], "playIng");
break
}
}
}
}
MUSICENGINE.prototype.songPlayMode = function(direction, mode) {
var albumIndex = this.albumIndex + 1,
songIndex = this.songIndex + 1,
song, album, songNum = this.song.songData[this.albumIndex].albumSong.length,
musicNum = this.song.songNum,
albumNum = this.song.songData.length;
if (mode === "列表循环") {
if (direction === "next") {
if (songIndex === songNum) {
if (albumIndex === albumNum && songIndex === songNum) {
album = 1;
song = 1
} else {
album = albumIndex + 1;
song = 1
}
} else {
album = albumIndex;
song = songIndex + 1
}
}
if (direction === "prev") {
if (songIndex === 1) {
if (albumIndex === 1 && songIndex === 1) {
album = albumNum;
song = this.song.songData[albumNum - 1].albumSong.length
} else {
album = albumIndex - 1;
song = this.song.songData[this.albumIndex - 1].albumSong.length
}
} else {
album = albumIndex;
song = songIndex - 1
}
}
}
if (mode === "随机播放") {
var randomAlbum = parseInt(albumNum * Math.random()),
randomSong = parseInt(this.song.songData[randomAlbum].albumSong.length * Math.random());
album = randomAlbum + 1;
song = randomSong + 1
}
if (mode === "顺序播放" || mode === "单曲循环") {
if (direction === "next") {
if (songIndex === songNum) {
if (albumIndex === albumNum && songIndex === songNum) {
playerInitialization();
return false
} else {
album = albumIndex + 1;
song = 1
}
} else {
album = albumIndex;
song = songIndex + 1
}
}
if (direction === "prev") {
if (songIndex === 1) {
if (albumIndex === 1 && songIndex === 1) {
playerInitialization()
} else {
album = albumIndex - 1;
song = this.song.songData[this.albumIndex - 1].albumSong.length
}
} else {
album = albumIndex;
song = songIndex - 1
}
}
}
this.playIndex(album - 1, song - 1)
};
MUSICENGINE.prototype.muiscIndexAndAlbumIndex = function(activeSong) {
var song = this.song,
albumNum = song.songData.length,
indexSongName = activeSong.childNodes[0].innerHTML,
indexAlbumName = activeSong.childNodes[1].innerHTML,
index = {};
for (var i = 0; i < albumNum; i++) {
if (indexAlbumName === song.songData[i].albumName) {
index.albumIndex = i;
for (var j = 0; j < song.songData[i].albumSong.length; j++) {
if (indexSongName === song.songData[i].albumSong[j].musicName) {
index.songIndex = j;
break
}
}
break
}
}
return index
};
MUSICENGINE.prototype.playIndex = function(albumIndex, songIndex) {
var albumFrontCover = document.getElementById("albumFrontCover"),
musicName = document.getElementById("musicName"),
musicSinger = document.getElementById("musicSinger"),
albumName = document.getElementById("albumName"),
loadLrc = document.getElementById("loadLrc"),
playTime = document.getElementById("playTime"),
surplusTime = document.getElementById("surplusTime"),
progressRateColor = document.getElementById("progressRateColor"),
song = this.song;
this.albumIndex = albumIndex;
this.songIndex = songIndex;
show(loadLrc);
playTime.innerHTML = "0:00";
surplusTime.innerHTML = "-0:00";
progressRateColor.style.width = "0";
this.musicPlayer.src = song.songData[albumIndex].albumSong[songIndex].musicLink;
albumFrontCover.src = song.songData[albumIndex].albumSong[songIndex].albumCoverMin || "images/album.png";
musicName.innerHTML = song.songData[albumIndex].albumSong[songIndex].musicName;
musicName.title = musicName.innerHTML;
musicSinger.innerHTML = song.songData[albumIndex].albumSong[songIndex].musicSinger;
musicSinger.title = musicSinger.innerHTML;
albumName.innerHTML = song.songData[albumIndex].albumName;
albumName.title = albumName.innerHTML;
this.toPlay("play");
this.processingLyrics(song.songData[albumIndex].albumSong[songIndex].lyricsLink);
this.updatePlaylist();
currentlyPlayingSong()
}; (function() {
var nowPlayManner = document.getElementById("nowPlayManner"),
playMannerControl = document.getElementById("playMannerControl"),
orderPlay = document.getElementById("orderPlay"),
shufflePlay = document.getElementById("shufflePlay"),
singleCycle = document.getElementById("singleCycle"),
listCycle = document.getElementById("listCycle");
nowPlayManner.onmouseover = function() {
show(playMannerControl)
};
playMannerControl.onmouseout = function(event) {
var Event = event || window.event;
if (Event) {
if (playMannerControl.contains(Event.relatedTarget || Event.toElement)) {
return false
} else {
hide(playMannerControl)
}
}
};
playMannerControl.onclick = function(event) {
var o = event ? event: window.event;
PlayModeIconChange(document.getElementById(o.target.id))
}
})();
function PlayModeIconChange(PlayMode) {
var nowPlayManner = document.getElementById("nowPlayManner"),
playMannerControl = document.getElementById("playMannerControl"),
className = PlayMode.className,
title = PlayMode.title,
newPlayMode;
nowPlayManner.className = "now-manner" + " " + className + " " + className + "-active";
nowPlayManner.title = title;
newPlayMode = document.createElement("a");
newPlayMode.href = "javascript:void(0);";
newPlayMode.id = PlayMode.id;
newPlayMode.className = PlayMode.className;
newPlayMode.title = PlayMode.title;
playMannerControl.removeChild(PlayMode);
playMannerControl.appendChild(newPlayMode);
hide(playMannerControl)
}
function playerInitialization() {
var albumFrontCover = document.getElementById("albumFrontCover"),
musicName = document.getElementById("musicName"),
musicSinger = document.getElementById("musicSinger"),
albumName = document.getElementById("albumName"),
playTime = document.getElementById("playTime"),
surplusTime = document.getElementById("surplusTime"),
progressRateColor = document.getElementById("progressRateColor"),
musicEngine = document.getElementById("musicEngine");
albumFrontCover.src = "http://www.wuover.com/wp-content/themes/QIUYE/music/images/images/flash.swf";
musicName.innerHTML = "百家网络博客播放器";
musicName.title = "百家网络博客";
musicSinger.innerHTML = "秋叶";
musicSinger.title = "播放最爱的音乐";
albumName.innerHTML = "";
albumName.title = "";
musicEngine.src = "";
playTime.innerHTML = "0:00";
surplusTime.innerHTML = "-0:00";
progressRateColor.style.width = "0";
currentlyPlayingSong()
}
MUSICENGINE.prototype.processingLyrics = function(lrc) {
var lrcBox = document.getElementById("lrcBox");
lrcBox.style.marginTop = 0;
var xmlhttp, lrcVal, lrcArray = [],
lrcTimeArray = [],
html = "",
musicName,
singer;
loadLrc(lrc);
function loadLrc(url) {
if (lrc === "") {
lrcBox.innerHTML = "<div class=\"no-lrc\">暂无歌词</div>"
} else {
xmlhttp = null;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest()
} else if (window.ActiveXObject) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")
}
if (xmlhttp != null) {
xmlhttp.onreadystatechange = getXMLHttpData;
xmlhttp.open("get", url, true);
xmlhttp.send(null)
} else {
alert("您的浏览器不支持 XMLHTTP")
}
}
}
function getXMLHttpData() {
if (xmlhttp.readyState === 4) {
if (xmlhttp.status === 0 || xmlhttp.status === 200) {
lrcVal = xmlhttp.responseText.replace(/\[\d\d:\d\d.\d\d]/g, "");
lrcArray = lrcVal.split("\n");
lrcArray[0].replace(/\[\w\w\:(.*?)\]/g,
function() {
musicName = arguments[1] || "暂无"
});
lrcArray[1].replace(/\[\w\w\:(.*?)\]/g,
function() {
singer = arguments[1] || "暂无"
});
html += "<p class=\"lrc-line\" data-timeLine=\"0\"><span class=\"mr15\">歌曲：" + musicName + "</span>歌手：" + singer + "</p>";
lrcArray.splice(0, 4);
xmlhttp.responseText.replace(/\[(\d*):(\d*)([\.|\:]\d*)\]/g,
function() {
var min = arguments[1] | 0,
sec = arguments[2] | 0,
realMin = min * 60 + sec;
lrcTimeArray.push(realMin)
});
for (var i = 0; i < lrcTimeArray.length; i++) {
html += "<p class=\"lrc-line\" data-timeLine=\"" + lrcTimeArray[i] + "\">" + lrcArray[i] + "</p>"
}
lrcBox.innerHTML = html
} else {
alert("获取歌词出错，请刷新浏览器")
}
}
}
};
function lrcMove(timeall, currenttime) {
var lrcBox = document.getElementById("lrcBox"),
domList = lrcBox.getElementsByTagName("p"),
timer,
index,
s,
m = parseInt(lrcBox.style.marginTop.split("-")[1]) || 0;
for (var i = 0; i < domList.length; i++) {
var dataTimeLine = parseInt(domList[i].attributes["data-timeLine"].nodeValue);
if (dataTimeLine > 0 && dataTimeLine === parseInt(currenttime)) {
index = i;
if (s != i) {
s = i;
for (var j = 0; j < domList.length; j++) {
removeClass(domList[j], "color")
}
if (index > 0) {
addClass(domList[index], "color")
}
clearInterval(timer);
timer = setInterval(function() {
m += 1;
if (m >= index * 30) {
clearInterval(timer)
} else {
lrcBox.style.marginTop = "-" + m + "px"
}
},
5)
}
}
}
}
function lrcAtuoMove(time) {
var lrcBox = document.getElementById("lrcBox"),
domList = lrcBox.getElementsByTagName("p"),
songTime = parseInt(time),
dataArr = [],
MoveTime,
e;
for (var i = 0; i < domList.length; i++) {
dataArr.push(domList[i].attributes["data-timeLine"].nodeValue)
}
for (var j = 0; j < dataArr.length; j++) {
if (dataArr[j] > songTime) {
MoveTime = dataArr[j - 1];
break
}
}
e = MoveTime ? dataArr.indexOf(MoveTime) : domList.length - 1;
lrcBox.style.marginTop = "-" + parseInt(e) * 30 + "px";
for (var k = 0; k < domList.length; k++) {
removeClass(domList[k], "color")
}
if (e > 0) {
addClass(domList[e], "color")
}
}
function progressBarPercentage(totalLength, actLage) {
var Result = (parseInt(actLage) / parseInt(totalLength)) * 100;
return Math.ceil(Result)
}
function musicPlayerSwitch() {
var musicPla = document.getElementById("musicPlayerWrap"),
playerSwitch = document.getElementById("musicPlayerSwitch"),
musicList = document.getElementById("musicList"),
timer = 0,
suoying = document.all.musicPlayer.offsetWidth,
n = -suoying,
m = 0;
if (hasClass(playerSwitch, "on")) {
replaceClass(playerSwitch, "on", "off");
clearInterval(timer);
timer = setInterval(function() {
n += 10;
musicPla.style.left = n + "px";
if (musicList) {
musicList.style.left = n + "px"
}
if (n >= 0) {
clearInterval(timer);
replaceClass(document.getElementById("playerSwitchBtn"), "switch-on", "switch-off");
playerSwitch.title = "隐藏播放器"
}
},
5);
} else if (hasClass(playerSwitch, "off")) {
replaceClass(playerSwitch, "off", "on");
clearInterval(timer);
timer = setInterval(function() {
m += 10;
musicPla.style.left = "-" + m + "px";
if (musicList) {
musicList.style.left = "-" + m + "px"
}
if (m >= suoying) {
clearInterval(timer);
replaceClass(document.getElementById("playerSwitchBtn"), "switch-off", "switch-on");
playerSwitch.title = "打开播放器"
}
},
5)
}
}
function lrcBoxSwitch() {
var lyrics = document.getElementById("lyrics"),
lrcWrap = document.getElementById("lrcWrap");
if (!hasClass(lyrics, "lyrics-hover")) {
lyrics.title = "关闭歌词";
addClass(lyrics, "lyrics-hover");
removeClass(lrcWrap, "hidden")
} else {
lyrics.title = "打开歌词";
removeClass(lyrics, "lyrics-hover");
addClass(lrcWrap, "hidden")
}
}
function hasClass(element, className) {
var classNum = element.className.split(" "),
result;
for (var i = 0; i < classNum.length; i++) {
if (classNum[i] === className) {
result = true;
break
} else {
result = false
}
}
return result
}
function addClass(element, className) {
if (!hasClass(element, className)) {
element.className += " " + className
}
}
function removeClass(element, className) {
if (hasClass(element, className)) {
var classNum = element.className.split(" ");
for (var i = 0; i < classNum.length; i++) {
if (classNum[i] === className) {
classNum.splice(i, 1);
element.className = classNum.join(" ");
break
}
}
}
}
function replaceClass(element, hasClassName, replaceClassName) {
if (hasClass(element, hasClassName)) {
var classNum = element.className.split(" ");
for (var i = 0; i < classNum.length; i++) {
if (classNum[i] === hasClassName) {
classNum[i] = replaceClassName;
element.className = classNum.join(" ");
break
}
}
}
}
function show(element) {
element.style.display = "block"
}
function hide(element) {
element.style.display = "none"
}
function fadeIn(element) {
var timer, opacity = 0;
element.style.opacity = opacity;
show(element);
timer = setInterval(function() {
opacity += 0.1;
element.style.opacity = opacity;
if (opacity === 10) {
clearInterval(timer)
}
},
30)
}
function fadeOut(element) {
var timer, opacity = 1;
element.style.opacity = opacity;
timer = setInterval(function() {
opacity -= 0.1;
element.style.opacity = opacity;
if (opacity === 0) {
clearInterval(timer)
}
},
30);
hide(element)
}
function coordinate(e) {
var o = window.event || e,
coord, coord_X, coord_Y;
coord_X = (o.offsetX === undefined) ? getOffset(o).X: o.offsetX;
coord_Y = (o.offsetY === undefined) ? getOffset(o).Y: o.offsetY;
coord = {
"coord_X": coord_X,
"coord_Y": coord_Y
};
return coord
}
function getOffset(e) {
var target = e.target,
eventCoord, pageCoord, offsetCoord;
pageCoord = getPageCoord(target);
eventCoord = {
X: window.pageXOffset + e.clientX,
Y: window.pageYOffset + e.clientY
};
offsetCoord = {
X: eventCoord.X - pageCoord.X,
Y: eventCoord.Y - pageCoord.Y
};
return offsetCoord
}
function getPageCoord(element) {
var coord = {
X: 0,
Y: 0
};
while (element) {
coord.X += element.offsetLeft;
coord.Y += element.offsetTop;
element = element.offsetParent
}
return coord
}
</code>
(function() {
XMLHttpData()
})();
0 >= String(window.location).indexOf("www.wuover.com") && (window.location = "http://www.wuover.com");
function XMLHttpData() {
var xmlhttp, song;
loadXMLDoc("http://www.wuover.com/wp-content/themes/QIUYE/music/song.json");
function loadXMLDoc(url) {
xmlhttp = null;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest()
} else if (window.ActiveXObject) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")
}
if (xmlhttp != null) {
xmlhttp.onreadystatechange = getXMLHttpData;
xmlhttp.open("get", url, true);
xmlhttp.send(null)
} else {
alert("您的浏览器不支持 XMLHTTP")
}
}
function getXMLHttpData() {
if (xmlhttp.readyState === 4) {
if (xmlhttp.status === 0 || xmlhttp.status === 200) {
song = eval("(" + xmlhttp.responseText + ")");
formatPlayer(song)
} else {
alert("XMLHTTP 错误，请刷新浏览器")
}
}
}
}
function formatPlayer(song) {
var mEngine = new MUSICENGINE(song),
mPlay = document.getElementById("musicEngine"),
mPlayerSwitch = document.getElementById("musicPlayerSwitch"),
play = document.getElementById("play"),
pause = document.getElementById("pause"),
next = document.getElementById("next"),
prev = document.getElementById("prev"),
nowVolume = document.getElementById("nowVolume"),
nowMute = document.getElementById("nowMute"),
volume = document.getElementById("volume"),
mute = document.getElementById("mute"),
volumeSizeBg = document.getElementById("volumeSizeBg"),
progressRateBg = document.getElementById("progressRateBg"),
lyrics = document.getElementById("lyrics"),
albumLists = document.getElementById("albumLists");
mPlayerSwitch.onclick = function() {
musicPlayerSwitch()
};
play.onclick = function() {
mEngine.toPlay("play")
};
pause.onclick = function() {
mEngine.toPlay("pause")
};
next.onclick = function() {
if (mPlay.src != "") {
mEngine.next()
}
};
prev.onclick = function() {
if (mPlay.src != "") {
mEngine.prev()
}
};
nowVolume.onclick = function() {
mEngine.volume("on")
};
nowMute.onclick = function() {
mEngine.volume("off")
};
volume.onclick = function() {
mEngine.volume("on")
};
mute.onclick = function() {
mEngine.volume("off")
};
volumeSizeBg.onclick = function(event) {
var realVolume = VolumeChangeProcess(event);
mEngine.volumeControlStrip(realVolume)
};
progressRateBg.onclick = function(event) {
if (mPlay.src != "") {
var activeProgress = getSongProgress(event);
mEngine.songProgressAdjust(activeProgress)
} else {
return false
}
};
albumLists.onclick = function() {
mEngine.albumLists()
};
document.getElementsByTagName("body")[0].onclick = function(event) {
var o = event ? event: window.event;
if (o.target.id === "closeList") {
closeList();
return false
}
if (o.target.id === "cutoverList") {
if (o.target.innerHTML === "返回") {
document.getElementById("albumLists").click();
document.getElementById("albumLists").click();
mEngine.formatAlbumLists();
return false
}
if (o.target.innerHTML === "专辑列表") {
document.getElementById("albumLists").click();
mEngine.formatAlbumLists();
return false
}
if (o.target.innerHTML === "查看全部歌曲") {
mEngine.formatAllSongLists();
return false
}
}
if (o.target.parentNode) {
if (o.target.parentNode.className === "s-l") {
var musicIndex = mEngine.muiscIndexAndAlbumIndex(o.target.parentNode);
mEngine.playIndex(musicIndex.albumIndex, musicIndex.songIndex);
currentlyPlayingSong();
return false
}
}
if (o.target.className === "play-btn") {
o.target.parentNode.parentNode.ondblclick();
document.getElementById("listWrap").childNodes[0].childNodes[0].click();
return false
}
if (o.target.className === "play-icon") {
o.target.parentNode.parentNode.parentNode.ondblclick();
document.getElementById("listWrap").childNodes[0].childNodes[0].click();
return false
}
};
lyrics.onclick = function() {
lrcBoxSwitch()
};
lyrics.click();
}
function MUSICENGINE(song) {
var musicEngine = document.createElement("audio");
musicEngine.id = "musicEngine";
document.getElementById("musicPlayerWrap").appendChild(musicEngine);
this.song = song;
this.musicPlayer = document.getElementById("musicEngine");
this.musicPlayer.addEventListener("canplaythrough",
function() {
hide(document.getElementById("loadLrc"))
})
}
MUSICENGINE.prototype.toPlay = function(toPlay) {
var play = document.getElementById("play"),
pause = document.getElementById("pause");
if (this.musicPlayer.src === "") {
this.playIndex(0, 0)
}
if (toPlay === "play") {
this.musicPlayer.play();
this.playbackProgress("play");
hide(play);
show(pause)
}
if (toPlay === "pause") {
this.musicPlayer.pause();
this.playbackProgress("pause");
show(play);
hide(pause)
}
};
MUSICENGINE.prototype.next = function() {
var mode = document.getElementById("nowPlayManner").title;
this.songPlayMode("next", mode)
};
MUSICENGINE.prototype.prev = function() {
var mode = document.getElementById("nowPlayManner").title;
this.songPlayMode("prev", mode)
};
MUSICENGINE.prototype.volume = function(muteSwitch) {
var volumeSizeColor = document.getElementById("volumeSizeColor"),
volumeSizeSave = parseInt(volumeSizeColor.style.height);
if (muteSwitch === "on") {
volumeSizeColor.attributes["data-volume"].nodeValue = this.musicPlayer.volume;
volumeSizeColor.attributes["data-height"].nodeValue = volumeSizeSave;
this.musicPlayer.volume = 0.0;
volumeIconSwitch("on");
volumeSize(100)
}
if (muteSwitch === "off") {
this.musicPlayer.volume = volumeSizeColor.attributes["data-volume"].nodeValue;
volumeIconSwitch("off");
volumeSize(volumeSizeColor.attributes["data-height"].nodeValue)
}
};
MUSICENGINE.prototype.volumeControlStrip = function(realVolume) {
this.musicPlayer.volume = realVolume;
if (realVolume > 0) {
volumeIconSwitch("off")
} else {
volumeIconSwitch("on")
}
};
function VolumeChangeProcess(event) {
var volumeSizeBg = document.getElementById("volumeSizeBg"),
progressBP,
realVolume;
var coord = coordinate(event),
offsetCoord_Y = coord.coord_Y;
progressBP = progressBarPercentage(48, offsetCoord_Y);
volumeSize(progressBP);
realVolume = parseInt((100 - progressBP) / 10) / 10;
return realVolume
}
function volumeIconSwitch(muteSwitch) {
var nowVolume = document.getElementById("nowVolume"),
nowMute = document.getElementById("nowMute"),
volume = document.getElementById("volume"),
mute = document.getElementById("mute"),
volumeSizeColor = document.getElementById("volumeSizeColor");
if (muteSwitch === "on") {
hide(nowVolume);
show(nowMute);
hide(volume);
show(mute);
volumeSizeColor.style.height = "100%"
}
if (muteSwitch === "off") {
hide(nowMute);
show(nowVolume);
hide(mute);
show(volume)
}
}
function volumeSize(size) {
var volumeSizeColor = document.getElementById("volumeSizeColor");
volumeSizeColor.style.height = size + "%"
} (function() {
var nowVolume = document.getElementById("nowVolume"),
nowMute = document.getElementById("nowMute"),
volumeControl = document.getElementById("volumeControl");
nowVolume.onmouseover = function() {
show(volumeControl)
};
nowMute.onmouseover = function() {
show(volumeControl)
};
volumeControl.onmouseout = function(event) {
var Event = event || window.event;
if (Event) {
if (volumeControl.contains(Event.relatedTarget || Event.toElement)) {
return false
} else {
hide(volumeControl)
}
}
}
})();
MUSICENGINE.prototype.playbackProgress = function(playSwitch) {
var progressRateColor = document.getElementById("progressRateColor"),
songSchedule = 0,
timeall,
currenttime,
timer;
if (playSwitch === "play") {
timer = setInterval(function() {
var mPlayer = document.getElementById("musicEngine");
var mmWidth = document.all.progressRateBg.offsetWidth;
timeall = timeAll();
currenttime = currentTime();
lrcMove(timeall, currenttime);
songPlaybackTime(timeall, currenttime);
songSchedule = (currenttime / timeall) * mmWidth;
progressRateColor.style.width = songSchedule + "px";
if (mPlayer.ended) {
clearInterval(timer);
progressRateColor.style.width = 0;
if (document.getElementById("nowPlayManner").title === "单曲循环") {
mPlayer.currentTime = 0;
mPlayer.play()
} else {
document.getElementById("next").click()
}
}
},
1000)
}
if (playSwitch === "pause") {
clearInterval(timer)
}
};
MUSICENGINE.prototype.songProgressAdjust = function(time) {
this.musicPlayer.currentTime = time;
lrcAtuoMove(time)
};
function getSongProgress(event) {
var progressRateBg = document.getElementById("progressRateBg"),
mplayer = document.getElementById("musicEngine"),
progressBP,
SongProgress;
var coord = coordinate(event),
offsetCoord_X = coord.coord_X;
songScheduleChange(offsetCoord_X);
progressBP = progressBarPercentage(262, offsetCoord_X) / 100;
SongProgress = progressBP * mplayer.duration;
return SongProgress
}
function songScheduleChange(size) {
var progressRateColor = document.getElementById("progressRateColor");
progressRateColor.style.width = size + "px"
}
function timeAll() {
var mPlayer = document.getElementById("musicEngine");
if (mPlayer.currentTime != 0) {
return mPlayer.duration
} else {
return 0
}
}
function currentTime() {
var mPlayer = document.getElementById("musicEngine");
return mPlayer.currentTime
}
function songPlaybackTime(timeall, currenttime) {
var playTime = document.getElementById("playTime"),
surplusTime = document.getElementById("surplusTime"),
leftTime,
rightTime;
if (currenttime < timeall) {
leftTime = parseInt(currenttime);
rightTime = parseInt(timeall - currenttime);
playTime.innerHTML = conversionTime(leftTime);
surplusTime.innerHTML = "-" + conversionTime(rightTime)
} else {
playTime.innerHTML = "0:00";
surplusTime.innerHTML = "-0:00"
}
}
function conversionTime(time) {
var surplusMinite, surplusSecond, cTime;
surplusMinite = Math.floor((time / 60) % 60);
surplusSecond = Math.floor(time % 60);
if (surplusSecond < 10) {
surplusSecond = "0" + surplusSecond
}
cTime = surplusMinite + ":" + surplusSecond;
return cTime
}
MUSICENGINE.prototype.albumLists = function() {
innerMusicList();
var musicList = document.getElementById("musicList"),
albumLists = document.getElementById("albumLists"),
listWrap = document.getElementById("listWrap"),
listName = document.getElementById("listName"),
cutoverList = document.getElementById("cutoverList");
if (albumLists.title === "打开专辑列表") {
closeList();
removeClass(musicList, "hidden");
listWrap.className = "list-wrap album";
listName.innerHTML = "专辑列表";
cutoverList.innerHTML = "查看全部歌曲";
cutoverList.className = "cutover-list";
addClass(albumLists, "album-lists-hover");
albumLists.title = "关闭专辑列表";
this.formatAlbumLists()
} else {
if (albumLists.title === "关闭专辑列表") {
closeList()
}
}
};
MUSICENGINE.prototype.formatAlbumLists = function() {
var song = this.song,
listWrap = document.getElementById("listWrap"),
albumNum = song.songData.length,
html = "";
for (var i = 0; i < albumNum; i++) {
html += "<li class=\"s-l\">";
html += "<img src=\"" + song.songData[i].albumCoverMax + "\" class=\"album-cover\">";
html += "<span class=\"album-name\" title=\"" + song.songData[i].albumName + "\"><span class=\"speaker\"></span><span class=\"s-a\">" + song.songData[i].albumName + "</span></span>";
html += "<div class=\"album-cover-hover hidden\">";
html += "<div class=\"mask\" title=\"双击打开\"></div>";
html += "<span class=\"album-song-num\" title=\"" + song.songData[i].albumSong.length + "首歌曲\">" + song.songData[i].albumSong.length + "</span>";
html += "<div class=\"play-btn\" title=\"播放专辑：" + song.songData[i].albumName + "\"><div class=\"play-icon\"></div>播放专辑</div>";
html += "</div>";
html += "</li>"
}
listWrap.innerHTML = html;
for (var m = 0; m < listWrap.getElementsByTagName("li").length; m++) {
var dom = listWrap.getElementsByTagName("li")[m];
dom.onmouseover = function() {
show(this.childNodes[2])
};
dom.onmouseout = function(event) {
var Event = event || window.event;
if (Event) {
if (dom.contains(Event.relatedTarget || Event.toElement)) {
return false
} else {
hide(this.childNodes[2])
}
}
};
dom.ondblclick = function() {
formatInAlbumLists(song, this.childNodes[1].childNodes[1].innerHTML)
}
}
currentlyPlayingSong()
};
MUSICENGINE.prototype.formatAllSongLists = function() {
var song = this.song,
listWrap = document.getElementById("listWrap"),
cutoverList = document.getElementById("cutoverList"),
albumNum = song.songData.length,
albumSongNum,
html = "";
for (var i = 0; i < albumNum; i++) {
albumSongNum = song.songData[i].albumSong.length;
for (var j = 0; j < albumSongNum; j++) {
html += "<li class=\"s-l\">";
html += "<span class=\"s-name\" title=\"" + song.songData[i].albumSong[j].musicName + "\">" + song.songData[i].albumSong[j].musicName + "</span>";
html += "<span class=\"s-album\" title=\"" + song.songData[i].albumName + "\">" + song.songData[i].albumName + "</span>";
html += "<span class=\"s-time\">" + song.songData[i].albumSong[j].musicTime + "</span>";
html += "<div name=\"addFavorites\" class=\"add-favorites hidden\" title=\"喜欢\"></div>";
html += "</li>"
}
}
listWrap.className = "list-wrap song";
listWrap.attributes["data-temp"].nodeValue = "0";
cutoverList.innerHTML = "返回";
cutoverList.className = "cutover-list";
listWrap.innerHTML = html;
currentlyPlayingSong()
};
MUSICENGINE.prototype.updatePlaylist = function() {
var listWrap = document.getElementById("listWrap"),
song = this.song,
nextAlbumSong = song.songData[this.albumIndex].albumSong.length,
html = "";
if (hasClass(listWrap, "song") && listWrap.attributes["data-temp"].nodeValue === "1") {
for (var j = 0; j < nextAlbumSong; j++) {
html += "<li class=\"s-l\">";
html += "<span class=\"s-name\" title=\"" + song.songData[this.albumIndex].albumSong[j].musicName + "\">" + song.songData[this.albumIndex].albumSong[j].musicName + "</span>";
html += "<span class=\"s-album\" title=\"" + song.songData[this.albumIndex].albumName + "\">" + song.songData[this.albumIndex].albumName + "</span>";
html += "<span class=\"s-time\">" + song.songData[this.albumIndex].albumSong[j].musicTime + "</span>";
html += "<div name=\"addFavorites\" class=\"add-favorites hidden\" title=\"喜欢\"></div>";
html += "</li>"
}
listWrap.innerHTML = html
}
};
function formatInAlbumLists(song, AlbumName) {
var listWrap = document.getElementById("listWrap"),
cutoverList = document.getElementById("cutoverList"),
albumNum = song.songData.length,
albumSongNum,
html = "";
for (var i = 0; i < albumNum; i++) {
if (song.songData[i].albumName === AlbumName) {
albumSongNum = song.songData[i].albumSong.length;
for (var j = 0; j < albumSongNum; j++) {
html += "<li class=\"s-l\">";
html += "<span class=\"s-name\" title=\"" + song.songData[i].albumSong[j].musicName + "\">" + song.songData[i].albumSong[j].musicName + "</span>";
html += "<span class=\"s-album\" title=\"" + song.songData[i].albumName + "\">" + song.songData[i].albumName + "</span>";
html += "<span class=\"s-time\">" + song.songData[i].albumSong[j].musicTime + "</span>";
html += "<div name=\"addFavorites\" class=\"add-favorites hidden\" title=\"喜欢\"></div>";
html += "</li>"
}
}
}
listWrap.className = "list-wrap song";
listWrap.attributes["data-temp"].nodeValue = "1";
cutoverList.innerHTML = "返回";
cutoverList.className = "cutover-list";
listWrap.innerHTML = html;
currentlyPlayingSong()
}
function closeList() {
var musicList = document.getElementById("musicList"),
albumLists = document.getElementById("albumLists"),
listWrap = document.getElementById("listWrap");
addClass(musicList, "hidden");
removeClass(albumLists, "album-lists-hover");
albumLists.title = "打开专辑列表";
listWrap.className = "list-wrap"
}
function innerMusicList() {
if (!document.getElementById("musicList")) {
var musicListDom = document.createElement("div");
musicListDom.id = "musicList";
musicListDom.className = "music-list hidden";
document.getElementsByTagName("body")[0].appendChild(musicListDom);
var html = "";
html += "<div class=\"list-title\">";
html += "<strong id=\"listName\"></strong>";
html += "<span id=\"cutoverList\" class=\"cutover-list hidden\"></span>";
html += "<div id=\"closeList\" class=\"close-list\" title=\"关闭列表\"></div>";
html += "</div>";
html += "<ul id=\"listWrap\" class=\"list-wrap\" data-temp=\"\"></ul>";
document.getElementById("musicList").innerHTML = "";
document.getElementById("musicList").innerHTML = html
}
}
function currentlyPlayingSong() {
var list = document.getElementById("listWrap"),
indexMusicName = document.getElementById("musicName").innerHTML,
indexAlbumName = document.getElementById("albumName").innerHTML;
for (var i = 0; i < list.childNodes.length; i++) {
for (var j = 0; j < list.childNodes.length; j++) {
removeClass(list.childNodes[j], "playIng")
}
if (hasClass(list, "song")) {
if (list.childNodes[i].childNodes[0].innerHTML === indexMusicName) {
addClass(list.childNodes[i], "playIng");
break
}
}
if (hasClass(list, "album")) {
if (list.childNodes[i].childNodes[1].childNodes[1].innerHTML === indexAlbumName) {
addClass(list.childNodes[i], "playIng");
break
}
}
}
}
MUSICENGINE.prototype.songPlayMode = function(direction, mode) {
var albumIndex = this.albumIndex + 1,
songIndex = this.songIndex + 1,
song, album, songNum = this.song.songData[this.albumIndex].albumSong.length,
musicNum = this.song.songNum,
albumNum = this.song.songData.length;
if (mode === "列表循环") {
if (direction === "next") {
if (songIndex === songNum) {
if (albumIndex === albumNum && songIndex === songNum) {
album = 1;
song = 1
} else {
album = albumIndex + 1;
song = 1
}
} else {
album = albumIndex;
song = songIndex + 1
}
}
if (direction === "prev") {
if (songIndex === 1) {
if (albumIndex === 1 && songIndex === 1) {
album = albumNum;
song = this.song.songData[albumNum - 1].albumSong.length
} else {
album = albumIndex - 1;
song = this.song.songData[this.albumIndex - 1].albumSong.length
}
} else {
album = albumIndex;
song = songIndex - 1
}
}
}
if (mode === "随机播放") {
var randomAlbum = parseInt(albumNum * Math.random()),
randomSong = parseInt(this.song.songData[randomAlbum].albumSong.length * Math.random());
album = randomAlbum + 1;
song = randomSong + 1
}
if (mode === "顺序播放" || mode === "单曲循环") {
if (direction === "next") {
if (songIndex === songNum) {
if (albumIndex === albumNum && songIndex === songNum) {
playerInitialization();
return false
} else {
album = albumIndex + 1;
song = 1
}
} else {
album = albumIndex;
song = songIndex + 1
}
}
if (direction === "prev") {
if (songIndex === 1) {
if (albumIndex === 1 && songIndex === 1) {
playerInitialization()
} else {
album = albumIndex - 1;
song = this.song.songData[this.albumIndex - 1].albumSong.length
}
} else {
album = albumIndex;
song = songIndex - 1
}
}
}
this.playIndex(album - 1, song - 1)
};
MUSICENGINE.prototype.muiscIndexAndAlbumIndex = function(activeSong) {
var song = this.song,
albumNum = song.songData.length,
indexSongName = activeSong.childNodes[0].innerHTML,
indexAlbumName = activeSong.childNodes[1].innerHTML,
index = {};
for (var i = 0; i < albumNum; i++) {
if (indexAlbumName === song.songData[i].albumName) {
index.albumIndex = i;
for (var j = 0; j < song.songData[i].albumSong.length; j++) {
if (indexSongName === song.songData[i].albumSong[j].musicName) {
index.songIndex = j;
break
}
}
break
}
}
return index
};
MUSICENGINE.prototype.playIndex = function(albumIndex, songIndex) {
var albumFrontCover = document.getElementById("albumFrontCover"),
musicName = document.getElementById("musicName"),
musicSinger = document.getElementById("musicSinger"),
albumName = document.getElementById("albumName"),
loadLrc = document.getElementById("loadLrc"),
playTime = document.getElementById("playTime"),
surplusTime = document.getElementById("surplusTime"),
progressRateColor = document.getElementById("progressRateColor"),
song = this.song;
this.albumIndex = albumIndex;
this.songIndex = songIndex;
show(loadLrc);
playTime.innerHTML = "0:00";
surplusTime.innerHTML = "-0:00";
progressRateColor.style.width = "0";
this.musicPlayer.src = song.songData[albumIndex].albumSong[songIndex].musicLink;
albumFrontCover.src = song.songData[albumIndex].albumSong[songIndex].albumCoverMin || "images/album.png";
musicName.innerHTML = song.songData[albumIndex].albumSong[songIndex].musicName;
musicName.title = musicName.innerHTML;
musicSinger.innerHTML = song.songData[albumIndex].albumSong[songIndex].musicSinger;
musicSinger.title = musicSinger.innerHTML;
albumName.innerHTML = song.songData[albumIndex].albumName;
albumName.title = albumName.innerHTML;
this.toPlay("play");
this.processingLyrics(song.songData[albumIndex].albumSong[songIndex].lyricsLink);
this.updatePlaylist();
currentlyPlayingSong()
}; (function() {
var nowPlayManner = document.getElementById("nowPlayManner"),
playMannerControl = document.getElementById("playMannerControl"),
orderPlay = document.getElementById("orderPlay"),
shufflePlay = document.getElementById("shufflePlay"),
singleCycle = document.getElementById("singleCycle"),
listCycle = document.getElementById("listCycle");
nowPlayManner.onmouseover = function() {
show(playMannerControl)
};
playMannerControl.onmouseout = function(event) {
var Event = event || window.event;
if (Event) {
if (playMannerControl.contains(Event.relatedTarget || Event.toElement)) {
return false
} else {
hide(playMannerControl)
}
}
};
playMannerControl.onclick = function(event) {
var o = event ? event: window.event;
PlayModeIconChange(document.getElementById(o.target.id))
}
})();
function PlayModeIconChange(PlayMode) {
var nowPlayManner = document.getElementById("nowPlayManner"),
playMannerControl = document.getElementById("playMannerControl"),
className = PlayMode.className,
title = PlayMode.title,
newPlayMode;
nowPlayManner.className = "now-manner" + " " + className + " " + className + "-active";
nowPlayManner.title = title;
newPlayMode = document.createElement("a");
newPlayMode.href = "javascript:void(0);";
newPlayMode.id = PlayMode.id;
newPlayMode.className = PlayMode.className;
newPlayMode.title = PlayMode.title;
playMannerControl.removeChild(PlayMode);
playMannerControl.appendChild(newPlayMode);
hide(playMannerControl)
}
function playerInitialization() {
var albumFrontCover = document.getElementById("albumFrontCover"),
musicName = document.getElementById("musicName"),
musicSinger = document.getElementById("musicSinger"),
albumName = document.getElementById("albumName"),
playTime = document.getElementById("playTime"),
surplusTime = document.getElementById("surplusTime"),
progressRateColor = document.getElementById("progressRateColor"),
musicEngine = document.getElementById("musicEngine");
albumFrontCover.src = "http://www.wuover.com/wp-content/themes/QIUYE/music/images/images/flash.swf";
musicName.innerHTML = "百家网络博客播放器";
musicName.title = "百家网络博客";
musicSinger.innerHTML = "秋叶";
musicSinger.title = "播放最爱的音乐";
albumName.innerHTML = "";
albumName.title = "";
musicEngine.src = "";
playTime.innerHTML = "0:00";
surplusTime.innerHTML = "-0:00";
progressRateColor.style.width = "0";
currentlyPlayingSong()
}
MUSICENGINE.prototype.processingLyrics = function(lrc) {
var lrcBox = document.getElementById("lrcBox");
lrcBox.style.marginTop = 0;
var xmlhttp, lrcVal, lrcArray = [],
lrcTimeArray = [],
html = "",
musicName,
singer;
loadLrc(lrc);
function loadLrc(url) {
if (lrc === "") {
lrcBox.innerHTML = "<div class=\"no-lrc\">暂无歌词</div>"
} else {
xmlhttp = null;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest()
} else if (window.ActiveXObject) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")
}
if (xmlhttp != null) {
xmlhttp.onreadystatechange = getXMLHttpData;
xmlhttp.open("get", url, true);
xmlhttp.send(null)
} else {
alert("您的浏览器不支持 XMLHTTP")
}
}
}
function getXMLHttpData() {
if (xmlhttp.readyState === 4) {
if (xmlhttp.status === 0 || xmlhttp.status === 200) {
lrcVal = xmlhttp.responseText.replace(/\[\d\d:\d\d.\d\d]/g, "");
lrcArray = lrcVal.split("\n");
lrcArray[0].replace(/\[\w\w\:(.*?)\]/g,
function() {
musicName = arguments[1] || "暂无"
});
lrcArray[1].replace(/\[\w\w\:(.*?)\]/g,
function() {
singer = arguments[1] || "暂无"
});
html += "<p class=\"lrc-line\" data-timeLine=\"0\"><span class=\"mr15\">歌曲：" + musicName + "</span>歌手：" + singer + "</p>";
lrcArray.splice(0, 4);
xmlhttp.responseText.replace(/\[(\d*):(\d*)([\.|\:]\d*)\]/g,
function() {
var min = arguments[1] | 0,
sec = arguments[2] | 0,
realMin = min * 60 + sec;
lrcTimeArray.push(realMin)
});
for (var i = 0; i < lrcTimeArray.length; i++) {
html += "<p class=\"lrc-line\" data-timeLine=\"" + lrcTimeArray[i] + "\">" + lrcArray[i] + "</p>"
}
lrcBox.innerHTML = html
} else {
alert("获取歌词出错，请刷新浏览器")
}
}
}
};
function lrcMove(timeall, currenttime) {
var lrcBox = document.getElementById("lrcBox"),
domList = lrcBox.getElementsByTagName("p"),
timer,
index,
s,
m = parseInt(lrcBox.style.marginTop.split("-")[1]) || 0;
for (var i = 0; i < domList.length; i++) {
var dataTimeLine = parseInt(domList[i].attributes["data-timeLine"].nodeValue);
if (dataTimeLine > 0 && dataTimeLine === parseInt(currenttime)) {
index = i;
if (s != i) {
s = i;
for (var j = 0; j < domList.length; j++) {
removeClass(domList[j], "color")
}
if (index > 0) {
addClass(domList[index], "color")
}
clearInterval(timer);
timer = setInterval(function() {
m += 1;
if (m >= index * 30) {
clearInterval(timer)
} else {
lrcBox.style.marginTop = "-" + m + "px"
}
},
5)
}
}
}
}
function lrcAtuoMove(time) {
var lrcBox = document.getElementById("lrcBox"),
domList = lrcBox.getElementsByTagName("p"),
songTime = parseInt(time),
dataArr = [],
MoveTime,
e;
for (var i = 0; i < domList.length; i++) {
dataArr.push(domList[i].attributes["data-timeLine"].nodeValue)
}
for (var j = 0; j < dataArr.length; j++) {
if (dataArr[j] > songTime) {
MoveTime = dataArr[j - 1];
break
}
}
e = MoveTime ? dataArr.indexOf(MoveTime) : domList.length - 1;
lrcBox.style.marginTop = "-" + parseInt(e) * 30 + "px";
for (var k = 0; k < domList.length; k++) {
removeClass(domList[k], "color")
}
if (e > 0) {
addClass(domList[e], "color")
}
}
function progressBarPercentage(totalLength, actLage) {
var Result = (parseInt(actLage) / parseInt(totalLength)) * 100;
return Math.ceil(Result)
}
function musicPlayerSwitch() {
var musicPla = document.getElementById("musicPlayerWrap"),
playerSwitch = document.getElementById("musicPlayerSwitch"),
musicList = document.getElementById("musicList"),
timer = 0,
suoying = document.all.musicPlayer.offsetWidth,
n = -suoying,
m = 0;
if (hasClass(playerSwitch, "on")) {
replaceClass(playerSwitch, "on", "off");
clearInterval(timer);
timer = setInterval(function() {
n += 10;
musicPla.style.left = n + "px";
if (musicList) {
musicList.style.left = n + "px"
}
if (n >= 0) {
clearInterval(timer);
replaceClass(document.getElementById("playerSwitchBtn"), "switch-on", "switch-off");
playerSwitch.title = "隐藏播放器"
}
},
5);
} else if (hasClass(playerSwitch, "off")) {
replaceClass(playerSwitch, "off", "on");
clearInterval(timer);
timer = setInterval(function() {
m += 10;
musicPla.style.left = "-" + m + "px";
if (musicList) {
musicList.style.left = "-" + m + "px"
}
if (m >= suoying) {
clearInterval(timer);
replaceClass(document.getElementById("playerSwitchBtn"), "switch-off", "switch-on");
playerSwitch.title = "打开播放器"
}
},
5)
}
}
function lrcBoxSwitch() {
var lyrics = document.getElementById("lyrics"),
lrcWrap = document.getElementById("lrcWrap");
if (!hasClass(lyrics, "lyrics-hover")) {
lyrics.title = "关闭歌词";
addClass(lyrics, "lyrics-hover");
removeClass(lrcWrap, "hidden")
} else {
lyrics.title = "打开歌词";
removeClass(lyrics, "lyrics-hover");
addClass(lrcWrap, "hidden")
}
}
function hasClass(element, className) {
var classNum = element.className.split(" "),
result;
for (var i = 0; i < classNum.length; i++) {
if (classNum[i] === className) {
result = true;
break
} else {
result = false
}
}
return result
}
function addClass(element, className) {
if (!hasClass(element, className)) {
element.className += " " + className
}
}
function removeClass(element, className) {
if (hasClass(element, className)) {
var classNum = element.className.split(" ");
for (var i = 0; i < classNum.length; i++) {
if (classNum[i] === className) {
classNum.splice(i, 1);
element.className = classNum.join(" ");
break
}
}
}
}
function replaceClass(element, hasClassName, replaceClassName) {
if (hasClass(element, hasClassName)) {
var classNum = element.className.split(" ");
for (var i = 0; i < classNum.length; i++) {
if (classNum[i] === hasClassName) {
classNum[i] = replaceClassName;
element.className = classNum.join(" ");
break
}
}
}
}
function show(element) {
element.style.display = "block"
}
function hide(element) {
element.style.display = "none"
}
function fadeIn(element) {
var timer, opacity = 0;
element.style.opacity = opacity;
show(element);
timer = setInterval(function() {
opacity += 0.1;
element.style.opacity = opacity;
if (opacity === 10) {
clearInterval(timer)
}
},
30)
}
function fadeOut(element) {
var timer, opacity = 1;
element.style.opacity = opacity;
timer = setInterval(function() {
opacity -= 0.1;
element.style.opacity = opacity;
if (opacity === 0) {
clearInterval(timer)
}
},
30);
hide(element)
}
function coordinate(e) {
var o = window.event || e,
coord, coord_X, coord_Y;
coord_X = (o.offsetX === undefined) ? getOffset(o).X: o.offsetX;
coord_Y = (o.offsetY === undefined) ? getOffset(o).Y: o.offsetY;
coord = {
"coord_X": coord_X,
"coord_Y": coord_Y
};
return coord
}
function getOffset(e) {
var target = e.target,
eventCoord, pageCoord, offsetCoord;
pageCoord = getPageCoord(target);
eventCoord = {
X: window.pageXOffset + e.clientX,
Y: window.pageYOffset + e.clientY
};
offsetCoord = {
X: eventCoord.X - pageCoord.X,
Y: eventCoord.Y - pageCoord.Y
};
return offsetCoord
}
function getPageCoord(element) {
var coord = {
X: 0,
Y: 0
};
while (element) {
coord.X += element.offsetLeft;
coord.Y += element.offsetTop;
element = element.offsetParent
}
return coord
}
</code>
2、播放器CSS 样式
<code>
/*音乐播放器*/
.hidden{display:none;}.m-player-wrap{position:fixed;left:-550px;bottom:32px;z-index:3;width:570px;height:96px;color:#828282;font:normal 12px/1.5 Arial,Helvetica,Tahoma,"宋体",sans-serif;}.m-player-wrap .m-player{float:left;padding:10px;width:530px;height:76px;background: #000 url(images/3.gif);box-shadow:3px 3px 6px RGBA(0,0,0,.42);}.m-player-wrap .m-player-switch{float:left;padding:38px 0 0 5px;width:15px;height:58px;background:url("images/player.jpg");border-radius:0 6px 6px 0;cursor:pointer;box-shadow:3px 3px 6px RGBA(0,0,0,.42);}.switch-on,.switch-off,.play-lists,.album-lists,.lyrics,.favorites,.m-play,.m-pause,.m-next,.m-prev,.broadcast-control-r,.volume,.mute,.list-cycle,.single-cycle,.shuffle-play,.order-play,.close-list,.add-favorites,.play-icon,.speaker{background:url("images/player_img.png");}.m-player-switch:hover{background:#1b1b1b;}.switch-off,.switch-on{display:block;width:9px;height:18px;}.switch-off{background-position:-120px 0;}.switch-on{background-position:-132px 0;}.m-info{float:left;position:relative;width:200px;}.m-info .album-front-cover{float:left;width:75px;height:75px;overflow:hidden;}.m-info .front-cover-mask{position:absolute;left:0;width:75px;height:75px;background:none;cursor:pointer;-webkit-transition-duration:300ms;-moz-transition-duration:300ms;border-radius:50%;overflow:hidden;}.m-info .front-cover-mask:hover{opacity:0.5;}.m-info .info-wrap{padding:0 5px;width:115px;overflow:hidden;cursor:default;}.m-info .info-wrap dt{color:#fff;}.m-info .info-wrap dt,.m-info .info-wrap dd{width:120px;height:18px;overflow:hidden;}.m-info .m-function{padding-top:8px;}.album-lists,.lyrics,.favorites{float:left;margin-right:7px;width:14px;height:12px;cursor:pointer;}.album-lists{background-position:-16px 0;}.lyrics{background-position:-58px 0;}.favorites{background-position:-79px 0;}.album-lists:hover,.album-lists-hover{background-position:-16px -18px;}.lyrics:hover,.lyrics-hover{background-position:-58px -18px;}.favorites:hover,.favorites-hover{background-position:-79px -18px;}.broadcast-control{float:left;width:330px;height:75px;}.broadcast-control .broadcast-control {float:left;width:5px;height:75px;}.broadcast-control .broadcast-control-m{border-radius: 8px;float:left;position:relative;width:320px;height:75px;background:#fff url("images/control_panel_bg.png") repeat-x;}.m-next,.m-prev{position:absolute;top:23px;width:21px;height:22px;cursor:pointer;}.m-next{left:197px;background-position:-28px -80px;}.m-next:hover{background-position:-28px -102px;}.m-prev{left:101px;background-position:0 -80px;}.m-prev:hover{background-position:0 -102px;}.m-play{position:absolute;top:15px;left:147px;width:27px;height:38px;background-position:-152px -81px;cursor:pointer;}.m-play:hover{background-position:-124px -81px;}.m-pause{position:absolute;top:18px;left:148px;width:22px;height:34px;background-position:-85px -86px;cursor:pointer;}.m-pause:hover{background-position:-63px -86px;}.play-progress-rate{position:absolute;top:63px;width:320px;height:10px;}.play-progress-rate .progress-rate-bg{position:relative;margin: 0 auto;top:0;width:260px;height:5px;overflow:hidden;background:-webkit-gradient(linear,0 0,0 100%,from(#9c9d8b),to(#c0c2ae));background:-moz-linear-gradient(center top,#9c9d8b,#c0c2ae);border:1px solid #898b7c;border-radius:6px;cursor:pointer;}.play-progress-rate .progress-rate-bg .progress-rate-color{height:5px;background:-webkit-gradient(linear,0 0,0 100%,from(#8e9082),to(#4d4f42));background:-moz-linear-gradient(center top,#8e9082,#4d4f42);background-color:#7b7d6f\9;border-radius:2px;}.play-progress-rate .play-time,.play-progress-rate .surplus-time{position:absolute;top:-2px;height:10px;line-height:10px;overflow:hidden;font-size:10px;color:#65675a;-webkit-text-size-adjust:none;}.play-progress-rate .play-time{left:0;width:26px;text-align:right;}.play-progress-rate .surplus-time{left:291px;width:29px;text-align:left;}.volume-wrap,.play-manner-wrap{position:absolute;top:-51px;z-index:1000;width:26px;height:75px;background:#6a6e5b;border-radius:4px;}.volume-wrap{left:0;}.volume,.mute{position:absolute;left:6px;top:56px;width:17px;height:14px;cursor:pointer;-webkit-transition-duration:200ms;-moz-transition-duration:200ms;}.volume{background-position:-16px -36px;}.mute{background-position:-35px -36px;}.volume-active{background-position:-16px -56px;}.mute-active{background-position:-35px -56px;}.volume-active,.mute-active{opacity:1;}.now-volume{top:5px;}.volume-wrap .volume-size-bg{position:absolute;left:11px;top:4px;width:4px;height:48px;background:#ebeede;border-radius:2px;cursor:pointer;}.volume-wrap .volume-size-bg .volume-size-color{height:48px;background:#3c3d37;}.play-manner-wrap{padding:5px 4px;width:18px;height:65px;}.list-cycle,.single-cycle,.shuffle-play,.order-play{display:block;margin-bottom:3px;width:18px;height:14px;opacity:0.8;cursor:pointer;}.list-cycle{background-position:-57px -36px;}.list-cycle-active{background-position:-57px -56px;}.single-cycle{background-position:-105px -36px;}.single-cycle-active{background-position:-105px -56px;}.order-play{background-position:-81px -36px;}.order-play-active{background-position:-81px -56px;}.shuffle-play{background-position:-129px -36px;}.shuffle-play-active{background-position:-129px -56px;}.list-cycle-active,.single-cycle-active,.order-play-active,.shuffle-play-active{opacity:1;}.now-manner{position:absolute;right:5px;top:5px;}.play-manner-wrap{left:294px;}.list-cycle:hover,.single-cycle:hover,.order-play:hover,.shuffle-play:hover{opacity:1;}.music-list{position:fixed;bottom:90px;width:550px;max-width:100%;height:470px;overflow:hidden;color:#999;z-index:2;}.music-list .list-title{position:relative;padding:0 15px;height:50px;line-height:50px;background:#000;}.music-list .list-title strong{margin-right:13px;font:normal 18px "Microsoft Yahei";color:#fff;}.music-list .list-title .cutover-list{cursor:pointer;}.music-list .list-title .cutover-list:hover{color:#fff;}.music-list .list-title .close-list{display:block;position:absolute;right:5px;top:10px;width:10px;height:20px;background-position:-151px 0;opacity:0.8;cursor:pointer;}.music-list .list-title .close-list:hover{opacity:1;}.music-list .song{padding:1px 0;height:380px;background:#1b1b1b;overflow:auto;}.music-list .song li{position:relative;padding:0 15px 0 0;margin-bottom:1px;height:24px;line-height:24px;cursor:pointer;}.music-list .song li:hover{background:#000;color:#ccc;}.music-list .song .s-name,.music-list .song .s-album,.music-list .song .s-time{display:inline-block;overflow:hidden;text-align:left;font-size:0.7em;}.music-list .song .s-name{width:48%;padding-left:2%;white-space: nowrap;text-overflow:ellipsis; overflow:hidden;}.music-list .song .s-album{width:35%;}.music-list .song .s-time{width:15%;text-align:right;}.music-list .song .add-favorites{position:absolute;right:22px;top:5px;width:15px;height:12px;background-position:-79px 0;}.music-list .song .add-favorites:hover{background-position:-79px -18px;}.music-list .song .playIng{color:#fff;}.music-list .album{padding:13px 2% 13px 1%;height:360px;width:535px;max-width:100%;background:#1b1b1b;overflow:hidden;}.music-list .album li{float:left;position:relative;margin: 0 3% 0 2%;width:28%;text-align:center;}.music-list .album li .album-cover{margin-bottom:5px;width:100%;overflow:hidden;box-shadow:2px 4px 6px #0a0a0a;cursor:pointer;}.music-list .album li .album-name{display:inline-block;padding:0 5px;max-width:139px;height:18px;overflow:hidden;background:#101010;border-radius:10px;text-align:center;color:#979797;}.music-list .album .album-cover-hover{position:absolute;top:0;left:0;width:99%;height:82%;border:1px solid #fff;cursor:pointer;}.music-list .album .album-cover-hover .album-song-num{display:block;position:absolute;right:7px;top:7px;width:16px;height:16px;background:#000;border-radius:16px;color:#fff;font-size:10px;text-align:center;line-height:16px;-webkit-text-size-adjust:none;}.music-list .album .album-cover-hover .play-btn{position:absolute;top:125px;left:40px;width:78px;height:20px;line-height:20px;line-height:21px\9;background:#000;border-radius:10px;opacity:0.8;color:#fff;}.music-list .album .album-cover-hover .play-icon{float:right;width:12px;height:12px;background-position:-171px -1px;margin:4px 5px 0 -2px;}.music-list .album .album-cover-hover .mask{position:absolute;top:0;left:0;width:100%;background:#000;opacity:0.2;}.music-list .album .playIng .speaker{display:inline-block;margin-right:4px;width:10px;height:10px;background-position:-172px -19px;}.lrc-wrap{position:fixed;z-index:2;margin:0 auto;bottom:0;left:0;width:100%;height:30px;overflow:hidden;background-color:rgba(0,0,0,0.3);box-shadow:3px 3px 6px RGBA(0,0,0,.42);}.lrc-wrap .lrc-box .no-lrc,.lrc-wrap .load-lrc{height:28px;line-height:28px;text-align:center;}.lrc-wrap .lrc-box p{-webkit-transition: 0.3s;
-moz-transition:0.3s;-ms-transition:0.3s;-webkit-transform: scale(0.8);-moz-transform: scale(0.8);
-ms-transform:scale(0.8);transform:scale(0.8);display:block;height:30px;line-height:30px;text-align:center;color:blue;text-shadow: 1px 2px 3px rgba(67,8,7,0.8);font-size:2em;letter-spacing:15px;margin:0;padding:0;overflow:hidden;}.lrc-wrap .lrc-box .color{-webkit-transition: 0.3s;
-moz-transition:0.3s;-ms-transition:0.3s;-webkit-transform: scale(1.0);-moz-transform: scale(1.0);
-ms-transform:scale(1.0);transform:scale(1.0);font-size:2em;text-shadow: 1px 2px 3px rgba(67,8,7,0.8); color:red;letter-spacing:15px;margin:0;padding:0;overflow:hidden;}.mr15{margin-right:15px;}
@media screen and (max-width: 570px) {
.lrc-wrap .lrc-box p,.lrc-wrap .lrc-box .color{font-size:1.2em;letter-spacing:0.5em;}
.play-progress-rate{width: 110px;}
.play-progress-rate .progress-rate-bg{left: 3px;width: 60px;}
.play-progress-rate .surplus-time{left: 90px;}
.broadcast-control .broadcast-control-m{width: 120px;}
.m-info .info-wrap{width: 65px;}
.m-info {width: 150px;}
.m-info .info-wrap dt, .m-info .info-wrap dd{width: 70px;}
.m-pause{left: 47px;}
.m-play {left: 47px;}
.m-next {left: 96px;}
.m-prev {left: 2px;}
.music-list .album .album-cover-hover .play-btn{top: 50px;left: 0px;}
.music-list .album .album-cover-hover{height:78px;}
.music-list{bottom: 126px;height: 290px;max-width:290px;}
.music-list .album{height: 223px;width: 282px;}
.music-list .song{height:240px;}
.m-player-wrap .m-player{width: 270px;}
.m-player-wrap{left:-290px;width: 310px;}
.broadcast-control{width: 120px;}
.play-manner-wrap{left: 95px;}
}
</code>
/*音乐播放器*/
.hidden{display:none;}.m-player-wrap{position:fixed;left:-550px;bottom:32px;z-index:3;width:570px;height:96px;color:#828282;font:normal 12px/1.5 Arial,Helvetica,Tahoma,"宋体",sans-serif;}.m-player-wrap .m-player{float:left;padding:10px;width:530px;height:76px;background: #000 url(images/3.gif);box-shadow:3px 3px 6px RGBA(0,0,0,.42);}.m-player-wrap .m-player-switch{float:left;padding:38px 0 0 5px;width:15px;height:58px;background:url("images/player.jpg");border-radius:0 6px 6px 0;cursor:pointer;box-shadow:3px 3px 6px RGBA(0,0,0,.42);}.switch-on,.switch-off,.play-lists,.album-lists,.lyrics,.favorites,.m-play,.m-pause,.m-next,.m-prev,.broadcast-control-r,.volume,.mute,.list-cycle,.single-cycle,.shuffle-play,.order-play,.close-list,.add-favorites,.play-icon,.speaker{background:url("images/player_img.png");}.m-player-switch:hover{background:#1b1b1b;}.switch-off,.switch-on{display:block;width:9px;height:18px;}.switch-off{background-position:-120px 0;}.switch-on{background-position:-132px 0;}.m-info{float:left;position:relative;width:200px;}.m-info .album-front-cover{float:left;width:75px;height:75px;overflow:hidden;}.m-info .front-cover-mask{position:absolute;left:0;width:75px;height:75px;background:none;cursor:pointer;-webkit-transition-duration:300ms;-moz-transition-duration:300ms;border-radius:50%;overflow:hidden;}.m-info .front-cover-mask:hover{opacity:0.5;}.m-info .info-wrap{padding:0 5px;width:115px;overflow:hidden;cursor:default;}.m-info .info-wrap dt{color:#fff;}.m-info .info-wrap dt,.m-info .info-wrap dd{width:120px;height:18px;overflow:hidden;}.m-info .m-function{padding-top:8px;}.album-lists,.lyrics,.favorites{float:left;margin-right:7px;width:14px;height:12px;cursor:pointer;}.album-lists{background-position:-16px 0;}.lyrics{background-position:-58px 0;}.favorites{background-position:-79px 0;}.album-lists:hover,.album-lists-hover{background-position:-16px -18px;}.lyrics:hover,.lyrics-hover{background-position:-58px -18px;}.favorites:hover,.favorites-hover{background-position:-79px -18px;}.broadcast-control{float:left;width:330px;height:75px;}.broadcast-control .broadcast-control {float:left;width:5px;height:75px;}.broadcast-control .broadcast-control-m{border-radius: 8px;float:left;position:relative;width:320px;height:75px;background:#fff url("images/control_panel_bg.png") repeat-x;}.m-next,.m-prev{position:absolute;top:23px;width:21px;height:22px;cursor:pointer;}.m-next{left:197px;background-position:-28px -80px;}.m-next:hover{background-position:-28px -102px;}.m-prev{left:101px;background-position:0 -80px;}.m-prev:hover{background-position:0 -102px;}.m-play{position:absolute;top:15px;left:147px;width:27px;height:38px;background-position:-152px -81px;cursor:pointer;}.m-play:hover{background-position:-124px -81px;}.m-pause{position:absolute;top:18px;left:148px;width:22px;height:34px;background-position:-85px -86px;cursor:pointer;}.m-pause:hover{background-position:-63px -86px;}.play-progress-rate{position:absolute;top:63px;width:320px;height:10px;}.play-progress-rate .progress-rate-bg{position:relative;margin: 0 auto;top:0;width:260px;height:5px;overflow:hidden;background:-webkit-gradient(linear,0 0,0 100%,from(#9c9d8b),to(#c0c2ae));background:-moz-linear-gradient(center top,#9c9d8b,#c0c2ae);border:1px solid #898b7c;border-radius:6px;cursor:pointer;}.play-progress-rate .progress-rate-bg .progress-rate-color{height:5px;background:-webkit-gradient(linear,0 0,0 100%,from(#8e9082),to(#4d4f42));background:-moz-linear-gradient(center top,#8e9082,#4d4f42);background-color:#7b7d6f\9;border-radius:2px;}.play-progress-rate .play-time,.play-progress-rate .surplus-time{position:absolute;top:-2px;height:10px;line-height:10px;overflow:hidden;font-size:10px;color:#65675a;-webkit-text-size-adjust:none;}.play-progress-rate .play-time{left:0;width:26px;text-align:right;}.play-progress-rate .surplus-time{left:291px;width:29px;text-align:left;}.volume-wrap,.play-manner-wrap{position:absolute;top:-51px;z-index:1000;width:26px;height:75px;background:#6a6e5b;border-radius:4px;}.volume-wrap{left:0;}.volume,.mute{position:absolute;left:6px;top:56px;width:17px;height:14px;cursor:pointer;-webkit-transition-duration:200ms;-moz-transition-duration:200ms;}.volume{background-position:-16px -36px;}.mute{background-position:-35px -36px;}.volume-active{background-position:-16px -56px;}.mute-active{background-position:-35px -56px;}.volume-active,.mute-active{opacity:1;}.now-volume{top:5px;}.volume-wrap .volume-size-bg{position:absolute;left:11px;top:4px;width:4px;height:48px;background:#ebeede;border-radius:2px;cursor:pointer;}.volume-wrap .volume-size-bg .volume-size-color{height:48px;background:#3c3d37;}.play-manner-wrap{padding:5px 4px;width:18px;height:65px;}.list-cycle,.single-cycle,.shuffle-play,.order-play{display:block;margin-bottom:3px;width:18px;height:14px;opacity:0.8;cursor:pointer;}.list-cycle{background-position:-57px -36px;}.list-cycle-active{background-position:-57px -56px;}.single-cycle{background-position:-105px -36px;}.single-cycle-active{background-position:-105px -56px;}.order-play{background-position:-81px -36px;}.order-play-active{background-position:-81px -56px;}.shuffle-play{background-position:-129px -36px;}.shuffle-play-active{background-position:-129px -56px;}.list-cycle-active,.single-cycle-active,.order-play-active,.shuffle-play-active{opacity:1;}.now-manner{position:absolute;right:5px;top:5px;}.play-manner-wrap{left:294px;}.list-cycle:hover,.single-cycle:hover,.order-play:hover,.shuffle-play:hover{opacity:1;}.music-list{position:fixed;bottom:90px;width:550px;max-width:100%;height:470px;overflow:hidden;color:#999;z-index:2;}.music-list .list-title{position:relative;padding:0 15px;height:50px;line-height:50px;background:#000;}.music-list .list-title strong{margin-right:13px;font:normal 18px "Microsoft Yahei";color:#fff;}.music-list .list-title .cutover-list{cursor:pointer;}.music-list .list-title .cutover-list:hover{color:#fff;}.music-list .list-title .close-list{display:block;position:absolute;right:5px;top:10px;width:10px;height:20px;background-position:-151px 0;opacity:0.8;cursor:pointer;}.music-list .list-title .close-list:hover{opacity:1;}.music-list .song{padding:1px 0;height:380px;background:#1b1b1b;overflow:auto;}.music-list .song li{position:relative;padding:0 15px 0 0;margin-bottom:1px;height:24px;line-height:24px;cursor:pointer;}.music-list .song li:hover{background:#000;color:#ccc;}.music-list .song .s-name,.music-list .song .s-album,.music-list .song .s-time{display:inline-block;overflow:hidden;text-align:left;font-size:0.7em;}.music-list .song .s-name{width:48%;padding-left:2%;white-space: nowrap;text-overflow:ellipsis; overflow:hidden;}.music-list .song .s-album{width:35%;}.music-list .song .s-time{width:15%;text-align:right;}.music-list .song .add-favorites{position:absolute;right:22px;top:5px;width:15px;height:12px;background-position:-79px 0;}.music-list .song .add-favorites:hover{background-position:-79px -18px;}.music-list .song .playIng{color:#fff;}.music-list .album{padding:13px 2% 13px 1%;height:360px;width:535px;max-width:100%;background:#1b1b1b;overflow:hidden;}.music-list .album li{float:left;position:relative;margin: 0 3% 0 2%;width:28%;text-align:center;}.music-list .album li .album-cover{margin-bottom:5px;width:100%;overflow:hidden;box-shadow:2px 4px 6px #0a0a0a;cursor:pointer;}.music-list .album li .album-name{display:inline-block;padding:0 5px;max-width:139px;height:18px;overflow:hidden;background:#101010;border-radius:10px;text-align:center;color:#979797;}.music-list .album .album-cover-hover{position:absolute;top:0;left:0;width:99%;height:82%;border:1px solid #fff;cursor:pointer;}.music-list .album .album-cover-hover .album-song-num{display:block;position:absolute;right:7px;top:7px;width:16px;height:16px;background:#000;border-radius:16px;color:#fff;font-size:10px;text-align:center;line-height:16px;-webkit-text-size-adjust:none;}.music-list .album .album-cover-hover .play-btn{position:absolute;top:125px;left:40px;width:78px;height:20px;line-height:20px;line-height:21px\9;background:#000;border-radius:10px;opacity:0.8;color:#fff;}.music-list .album .album-cover-hover .play-icon{float:right;width:12px;height:12px;background-position:-171px -1px;margin:4px 5px 0 -2px;}.music-list .album .album-cover-hover .mask{position:absolute;top:0;left:0;width:100%;background:#000;opacity:0.2;}.music-list .album .playIng .speaker{display:inline-block;margin-right:4px;width:10px;height:10px;background-position:-172px -19px;}.lrc-wrap{position:fixed;z-index:2;margin:0 auto;bottom:0;left:0;width:100%;height:30px;overflow:hidden;background-color:rgba(0,0,0,0.3);box-shadow:3px 3px 6px RGBA(0,0,0,.42);}.lrc-wrap .lrc-box .no-lrc,.lrc-wrap .load-lrc{height:28px;line-height:28px;text-align:center;}.lrc-wrap .lrc-box p{-webkit-transition: 0.3s;
-moz-transition:0.3s;-ms-transition:0.3s;-webkit-transform: scale(0.8);-moz-transform: scale(0.8);
-ms-transform:scale(0.8);transform:scale(0.8);display:block;height:30px;line-height:30px;text-align:center;color:blue;text-shadow: 1px 2px 3px rgba(67,8,7,0.8);font-size:2em;letter-spacing:15px;margin:0;padding:0;overflow:hidden;}.lrc-wrap .lrc-box .color{-webkit-transition: 0.3s;
-moz-transition:0.3s;-ms-transition:0.3s;-webkit-transform: scale(1.0);-moz-transform: scale(1.0);
-ms-transform:scale(1.0);transform:scale(1.0);font-size:2em;text-shadow: 1px 2px 3px rgba(67,8,7,0.8); color:red;letter-spacing:15px;margin:0;padding:0;overflow:hidden;}.mr15{margin-right:15px;}
@media screen and (max-width: 570px) {
.lrc-wrap .lrc-box p,.lrc-wrap .lrc-box .color{font-size:1.2em;letter-spacing:0.5em;}
.play-progress-rate{width: 110px;}
.play-progress-rate .progress-rate-bg{left: 3px;width: 60px;}
.play-progress-rate .surplus-time{left: 90px;}
.broadcast-control .broadcast-control-m{width: 120px;}
.m-info .info-wrap{width: 65px;}
.m-info {width: 150px;}
.m-info .info-wrap dt, .m-info .info-wrap dd{width: 70px;}
.m-pause{left: 47px;}
.m-play {left: 47px;}
.m-next {left: 96px;}
.m-prev {left: 2px;}
.music-list .album .album-cover-hover .play-btn{top: 50px;left: 0px;}
.music-list .album .album-cover-hover{height:78px;}
.music-list{bottom: 126px;height: 290px;max-width:290px;}
.music-list .album{height: 223px;width: 282px;}
.music-list .song{height:240px;}
.m-player-wrap .m-player{width: 270px;}
.m-player-wrap{left:-290px;width: 310px;}
.broadcast-control{width: 120px;}
.play-manner-wrap{left: 95px;}
}
</code>
3、html部分
<code>
<div id="circle"></div><div id="circle1" ></div>
<div id="musicPlayerWrap" class="m-player-wrap">
<div id="musicPlayer" class="m-player">
<div id="musicInfo" class="m-info">
<img decoding="async" src="http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif" id="albumFrontCover" class="album-front-cover" alt="专辑"/>
<div class="front-cover-mask" id="mumuoff" title=""></div>
<div id="infoWrap" class="info-wrap">
<dl>
<dt id="musicName" title="百家网络博客">百家网络博客</dt>
<dd id="musicSinger" title="播放最爱的音乐">秋叶</dd>
<dd id="albumName" title="">播放最爱的音乐</dd>
</dl>
<div id="musicFunction" class="m-function clearfix">
<a href="javascript:void(0);" id="albumLists" class="album-lists" title="打开专辑列表"></a>
<a href="javascript:void(0);" id="lyrics" class="lyrics" title="打开歌词"></a>
<a href="javascript:void(0);" id="favorites" class="favorites" title="打开收藏夹"></a>
</div>
</div>
</div>
<div id="broadcastControl" class="broadcast-control clearfix">
<div class="broadcast-control-m">
<a href="javascript:void(0);" id="play" class="m-play" title="播放"></a>
<a href="javascript:void(0);" id="pause" class="m-pause hidden" title="暂停"></a>
<a href="javascript:void(0);" id="next" class="m-next" title="下一曲"></a>
<a href="javascript:void(0);" id="prev" class="m-prev" title="上一曲"></a>
<div class="play-progress-rate">
<span id="playTime" class="play-time">0:00</span>
<div id="progressRateBg" class="progress-rate-bg">
<div id="progressRateColor" class="progress-rate-color" style="width:0;"></div>
</div>
<span id="surplusTime" class="surplus-time">-0:00</span>
</div>
<a href="javascript:void(0);" id="nowVolume" class="volume volume-active now-volume"></a>
<a href="javascript:void(0);" id="nowMute" class="mute mute-active now-volume hidden"></a>
<a href="javascript:void(0);" id="nowPlayManner" class="now-manner list-cycle list-cycle-active" title="列表循环"></a>
<div id="volumeControl" class="volume-wrap hidden">
<a href="javascript:void(0);" id="volume" class="volume" title="点击设为静音"></a>
<a href="javascript:void(0);" id="mute" class="mute hidden" title="点击开启声音"></a>
<div id="volumeSizeBg" class="volume-size-bg" title="音量调节">
<div id="volumeSizeColor" class="volume-size-color" data-volume="" data-height="" style="height:0;"></div>
</div>
</div>
<div id="playMannerControl" class="play-manner-wrap hidden">
<a href="javascript:void(0);" id="orderPlay" class="order-play" title="顺序播放"></a>
<a href="javascript:void(0);" id="shufflePlay" class="shuffle-play" title="随机播放"></a>
<a href="javascript:void(0);" id="singleCycle" class="single-cycle" title="单曲循环"></a>
<a href="javascript:void(0);" id="listCycle" class="list-cycle" title="列表循环"></a>
</div>
</div>
</div>
</div>
<div id="musicPlayerSwitch" class="m-player-switch on" title="打开播放器">
<a href="javascript:void(0);" id="playerSwitchBtn" class="switch-on"></a>
</div>
</div>
<div id="lrcWrap" class="lrc-wrap hidden">
<div id="loadLrc" class="load-lrc hidden"><i class="icon-music"></i>歌曲载入中...</div>
<div id="lrcBox" class="lrc-box"></div>
</div>
</code>
<div id="circle"></div><div id="circle1" ></div>
<div id="musicPlayerWrap" class="m-player-wrap">
<div id="musicPlayer" class="m-player">
<div id="musicInfo" class="m-info">
<img decoding="async" src="http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif" id="albumFrontCover" class="album-front-cover" alt="专辑"/>
<div class="front-cover-mask" id="mumuoff" title=""></div>
<div id="infoWrap" class="info-wrap">
<dl>
<dt id="musicName" title="百家网络博客">百家网络博客</dt>
<dd id="musicSinger" title="播放最爱的音乐">秋叶</dd>
<dd id="albumName" title="">播放最爱的音乐</dd>
</dl>
<div id="musicFunction" class="m-function clearfix">
<a href="javascript:void(0);" id="albumLists" class="album-lists" title="打开专辑列表"></a>
<a href="javascript:void(0);" id="lyrics" class="lyrics" title="打开歌词"></a>
<a href="javascript:void(0);" id="favorites" class="favorites" title="打开收藏夹"></a>
</div>
</div>
</div>
<div id="broadcastControl" class="broadcast-control clearfix">
<div class="broadcast-control-m">
<a href="javascript:void(0);" id="play" class="m-play" title="播放"></a>
<a href="javascript:void(0);" id="pause" class="m-pause hidden" title="暂停"></a>
<a href="javascript:void(0);" id="next" class="m-next" title="下一曲"></a>
<a href="javascript:void(0);" id="prev" class="m-prev" title="上一曲"></a>
<div class="play-progress-rate">
<span id="playTime" class="play-time">0:00</span>
<div id="progressRateBg" class="progress-rate-bg">
<div id="progressRateColor" class="progress-rate-color" style="width:0;"></div>
</div>
<span id="surplusTime" class="surplus-time">-0:00</span>
</div>
<a href="javascript:void(0);" id="nowVolume" class="volume volume-active now-volume"></a>
<a href="javascript:void(0);" id="nowMute" class="mute mute-active now-volume hidden"></a>
<a href="javascript:void(0);" id="nowPlayManner" class="now-manner list-cycle list-cycle-active" title="列表循环"></a>
<div id="volumeControl" class="volume-wrap hidden">
<a href="javascript:void(0);" id="volume" class="volume" title="点击设为静音"></a>
<a href="javascript:void(0);" id="mute" class="mute hidden" title="点击开启声音"></a>
<div id="volumeSizeBg" class="volume-size-bg" title="音量调节">
<div id="volumeSizeColor" class="volume-size-color" data-volume="" data-height="" style="height:0;"></div>
</div>
</div>
<div id="playMannerControl" class="play-manner-wrap hidden">
<a href="javascript:void(0);" id="orderPlay" class="order-play" title="顺序播放"></a>
<a href="javascript:void(0);" id="shufflePlay" class="shuffle-play" title="随机播放"></a>
<a href="javascript:void(0);" id="singleCycle" class="single-cycle" title="单曲循环"></a>
<a href="javascript:void(0);" id="listCycle" class="list-cycle" title="列表循环"></a>
</div>
</div>
</div>
</div>
<div id="musicPlayerSwitch" class="m-player-switch on" title="打开播放器">
<a href="javascript:void(0);" id="playerSwitchBtn" class="switch-on"></a>
</div>
</div>
<div id="lrcWrap" class="lrc-wrap hidden">
<div id="loadLrc" class="load-lrc hidden"><i class="icon-music"></i>歌曲载入中...</div>
<div id="lrcBox" class="lrc-box"></div>
</div>
</code>
4、播放器列表，返回的数据格式为json格式，起json格式为
<code>
{
"songData": [
{
"albumName": "推荐歌曲",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/tj.jpg",
"albumSong": [
{
"musicName": "安娜",
"musicSinger": "冷漠",
"musicLink": "http://cctv3.qiniudn.com/anna.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/anna.lrc",
"musicTime": "04:49",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/anna.jpg"
},
{
"musicName": "继续孤独",
"musicSinger": "张津涤",
"musicLink": "http://cctv3.qiniudn.com/jixugd.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/jixugd.lrc",
"musicTime": "04:37",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/jixugd.jpg"
},
{
"musicName": "黄昏",
"musicSinger": "网络女声",
"musicLink": "http://cctv3.qiniudn.com/huanghun.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/huanghun.lrc",
"musicTime": "04:52",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/huanghun.png"
},
{
"musicName": "爱有三分毒",
"musicSinger": "尚裘峰",
"musicLink": "http://cctv3.qiniudn.com/aysfd.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/aysfd.lrc",
"musicTime": "03:39",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/aysfd.png"
},
{
"musicName": "做你的雪莲",
"musicSinger": "艾歌",
"musicLink": "http://cctv3.qiniudn.com/zndxl.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/zndxl.lrc",
"musicTime": "04:19",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/zndxl.jpg"
},
{
"musicName": "爱你么么哒",
"musicSinger": "网络歌手",
"musicLink": "http://cctv3.qiniudn.com/anmmd.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/anmmd.lrc",
"musicTime": "03:55",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/anmmd.jpg"
},
{
"musicName": "越长大越孤单",
"musicSinger": "牛奶咖啡",
"musicLink": "http://cctv3.qiniudn.com/yuezhangdayuegudan.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/yuezhangdayuegudan.lrc",
"musicTime": "04:28",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "很难",
"musicSinger": "张震岳",
"musicLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/music/hn.ogg",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/hn.lrc",
"musicTime": "04:18",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/tj.jpg"
},
{
"musicName": "爱不会停",
"musicSinger": "易欣",
"musicLink": "http://cctv3.qiniudn.com/aibuhuiting.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/aibuhuiting.lrc",
"musicTime": "04:06",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "躲避的爱",
"musicSinger": "叶麟",
"musicLink": "http://cctv3.qiniudn.com/duobideai.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/duobideai.lrc",
"musicTime": "04:22",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "爱的漩涡dj版",
"musicSinger": "丁酉酉",
"musicLink": "http://cctv3.qiniudn.com/aidexuanwo.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/aidexuanwo.lrc",
"musicTime": "04:33",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "越单纯越幸福",
"musicSinger": "王筝",
"musicLink": "http://cctv3.qiniudn.com/yuedanchunyuexingfu.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/yuedanchunyuexingfu.lrc",
"musicTime": "04:40",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "MY ALL",
"musicSinger": "滨崎步",
"musicLink": "http://cctv3.qiniudn.com/myall.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/myall.lrc",
"musicTime": "05:25",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "听雨",
"musicSinger": "张雷",
"musicLink": "http://cctv3.qiniudn.com/tingyu.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/tingyu.lrc",
"musicTime": "04:13",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "勇敢勇敢",
"musicSinger": "黄勇",
"musicLink": "http://cctv3.qiniudn.com/yonggan.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/yonggan.lrc",
"musicTime": "04:27",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "花心的男人",
"musicSinger": "苏小花",
"musicLink": "http://cctv3.qiniudn.com/huaxindenanren.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/huaxindenanren.lrc",
"musicTime": "03:57",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "兄弟难当",
"musicSinger": "杜歌",
"musicLink": "http://cctv3.qiniudn.com/xiongdinandang.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/xiongdinandang.lrc",
"musicTime": "04:12",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
]
},
{
"albumName": "DJ舞曲",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/dj.jpg",
"albumSong": [
{
"musicName": "唐伯虎点秋香",
"musicSinger": "过江龙",
"musicLink": "http://cctv3.qiniudn.com/tbhdqx.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/tbhdqx.lrc",
"musicTime": "04:41",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "宁德皇庭俱乐部串烧",
"musicSinger": "宁德皇庭",
"musicLink": "http://cctv3.qiniudn.com/ndht.mp3",
"lyricsLink": "",
"musicTime": "60:06",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "爱中过枪dj",
"musicSinger": "门丽",
"musicLink": "http://cctv3.qiniudn.com/azgq.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/azgq.lrc",
"musicTime": "04:57",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "继续孤独DJ",
"musicSinger": "张祥洪",
"musicLink": "http://cctv3.qiniudn.com/jxgd.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/jxgd.lrc",
"musicTime": "06:04",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/jxgd.jpg"
},
{
"musicName": "真心至上dj",
"musicSinger": "DJ",
"musicLink": "http://cctv3.qiniudn.com/zxzs.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/zxzs.lrc",
"musicTime": "06:59",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "彻彻底底忘记你是谁dj",
"musicSinger": "陈咏",
"musicLink": "http://cctv3.qiniudn.com/ccddwjnss.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/ccddwjnss.lrc",
"musicTime": "06:59",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "痛心疾首dj",
"musicSinger": "浩轩",
"musicLink": "http://cctv3.qiniudn.com/tongxinjishou.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/tongxinjishou.lrc",
"musicTime": "05:01",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "不爱我就不要给我机会dj",
"musicSinger": "乐桐",
"musicLink": "http://cctv3.qiniudn.com/bawjbygwjh.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/bawjbygwjh.lrc",
"musicTime": "05:45",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
]
},
{
"albumName": "流行红歌",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/lx.jpg",
"albumSong": [
{
"musicName": "新娘不是我",
"musicSinger": "程响",
"musicLink": "http://cctv3.qiniudn.com/xnbsw.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/xnbsw.lrc",
"musicTime": "04:42",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "小苹果",
"musicSinger": "筷子兄弟 ",
"musicLink": "http://cctv3.qiniudn.com/xiaopingguo.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/xiaopingguo.lrc",
"musicTime": "03:31",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "你并不在意我爱你",
"musicSinger": "邱宏",
"musicLink": "http://cctv3.qiniudn.com/nbbzywan.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/nbbzywan.lrc",
"musicTime": "03:57",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
]
},
{
"albumName": "伤感情歌",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/qg.jpg",
"albumSong": [
{
"musicName": "丢了爱情丢了你",
"musicSinger": "高信",
"musicLink": "http://cctv3.qiniudn.com/dlaqdln.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/dlaqdln.lrc",
"musicTime": "03:47",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "苦果",
"musicSinger": "程响",
"musicLink": "http://cctv3.qiniudn.com/kuguo.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/kuguo.lrc",
"musicTime": "03:53",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "留不住你的温柔",
"musicSinger": "李泽坚&司徒兰芳",
"musicLink": "http://cctv3.qiniudn.com/liubuzhunidewenrou.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/liubuzhunidewenrou.lrc",
"musicTime": "03:55",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "最幸福的人",
"musicSinger": "曾春年",
"musicLink": "http://cctv3.qiniudn.com/zuixingfuderen.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/zuixingfuderen.lrc",
"musicTime": "04:36",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "辜负",
"musicSinger": "楼宏章",
"musicLink": "http://cctv3.qiniudn.com/gufu.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/gufu.lrc",
"musicTime": "04:09",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
}
]
},
{
"albumName": "怀旧歌曲",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/zzg.jpg",
"albumSong": [
{
"musicName": "捉泥鳅",
"musicSinger": "卓依婷",
"musicLink": "http://cctv3.qiniudn.com/zhuoniqiu.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/zhuoniqiu.lrc",
"musicTime": "02:38",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "记事本",
"musicSinger": "陈慧琳",
"musicLink": "http://cctv3.qiniudn.com/jishiben.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/jishiben.lrc",
"musicTime": "04:13",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "孤独的人并不寂寞",
"musicSinger": "雷婷",
"musicLink": "http://cctv3.qiniudn.com/gddrbbjm.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/gddrbbjm.lrc",
"musicTime": "04:32",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "偏偏喜欢你-古筝音乐",
"musicSinger": "段银莹",
"musicLink": "http://cctv3.qiniudn.com/ppxhn.mp3",
"lyricsLink": "",
"musicTime": "04:21",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
]
},
{
"albumName": "我的翻唱",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/qiuye.jpg",
"albumSong": [
{
"musicName": "只想一生跟你走",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-zxysgnz.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-zxysgnz.lrc",
"musicTime": "04:52",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "为爱停留",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-weiaitingliu.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-weiaitingliu.lrc",
"musicTime": "05:38",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "为什么相爱的人不能在一起",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-wsmxadrbnzyq.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-wsmxadrbnzyq.lrc",
"musicTime": "04:28",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "戒掉爱情戒掉你",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-jdaqjdn.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-jdaqjdn.lrc",
"musicTime": "03:58",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "你到底有没有爱过我",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-nddymyagw.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-nddymyagw.lrc",
"musicTime": "04:03",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "在心里从此永远有个你",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-zxlccyyygn.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-zxlccyyygn.lrc",
"musicTime": "04:25",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "我不后悔",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-wbhh.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-wbhh.lrc",
"musicTime": "04:04",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "偷偷联系",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-toutoulianxi.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-toutoulianxi.lrc",
"musicTime": "04:16",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "红尘情歌",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-hcqg.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-hcqg.lrc",
"musicTime": "03:29",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "思思念念全是你",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-ssnnqsn.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-ssnnqsn.lrc",
"musicTime": "04:07",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "爱上别人的人",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-asbrdr.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-asbrdr.lrc",
"musicTime": "03:47",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "爱情码头",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-aqmt.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-aqmt.lrc",
"musicTime": "04:57",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
]
}
],
"songNum": 13
}
</code>
{
"songData": [
{
"albumName": "推荐歌曲",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/tj.jpg",
"albumSong": [
{
"musicName": "安娜",
"musicSinger": "冷漠",
"musicLink": "http://cctv3.qiniudn.com/anna.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/anna.lrc",
"musicTime": "04:49",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/anna.jpg"
},
{
"musicName": "继续孤独",
"musicSinger": "张津涤",
"musicLink": "http://cctv3.qiniudn.com/jixugd.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/jixugd.lrc",
"musicTime": "04:37",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/jixugd.jpg"
},
{
"musicName": "黄昏",
"musicSinger": "网络女声",
"musicLink": "http://cctv3.qiniudn.com/huanghun.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/huanghun.lrc",
"musicTime": "04:52",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/huanghun.png"
},
{
"musicName": "爱有三分毒",
"musicSinger": "尚裘峰",
"musicLink": "http://cctv3.qiniudn.com/aysfd.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/aysfd.lrc",
"musicTime": "03:39",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/aysfd.png"
},
{
"musicName": "做你的雪莲",
"musicSinger": "艾歌",
"musicLink": "http://cctv3.qiniudn.com/zndxl.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/zndxl.lrc",
"musicTime": "04:19",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/zndxl.jpg"
},
{
"musicName": "爱你么么哒",
"musicSinger": "网络歌手",
"musicLink": "http://cctv3.qiniudn.com/anmmd.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/anmmd.lrc",
"musicTime": "03:55",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/anmmd.jpg"
},
{
"musicName": "越长大越孤单",
"musicSinger": "牛奶咖啡",
"musicLink": "http://cctv3.qiniudn.com/yuezhangdayuegudan.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/yuezhangdayuegudan.lrc",
"musicTime": "04:28",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "很难",
"musicSinger": "张震岳",
"musicLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/music/hn.ogg",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/hn.lrc",
"musicTime": "04:18",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/tj.jpg"
},
{
"musicName": "爱不会停",
"musicSinger": "易欣",
"musicLink": "http://cctv3.qiniudn.com/aibuhuiting.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/aibuhuiting.lrc",
"musicTime": "04:06",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "躲避的爱",
"musicSinger": "叶麟",
"musicLink": "http://cctv3.qiniudn.com/duobideai.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/duobideai.lrc",
"musicTime": "04:22",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "爱的漩涡dj版",
"musicSinger": "丁酉酉",
"musicLink": "http://cctv3.qiniudn.com/aidexuanwo.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/aidexuanwo.lrc",
"musicTime": "04:33",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "越单纯越幸福",
"musicSinger": "王筝",
"musicLink": "http://cctv3.qiniudn.com/yuedanchunyuexingfu.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/yuedanchunyuexingfu.lrc",
"musicTime": "04:40",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "MY ALL",
"musicSinger": "滨崎步",
"musicLink": "http://cctv3.qiniudn.com/myall.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/myall.lrc",
"musicTime": "05:25",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "听雨",
"musicSinger": "张雷",
"musicLink": "http://cctv3.qiniudn.com/tingyu.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/tingyu.lrc",
"musicTime": "04:13",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "勇敢勇敢",
"musicSinger": "黄勇",
"musicLink": "http://cctv3.qiniudn.com/yonggan.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/yonggan.lrc",
"musicTime": "04:27",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "花心的男人",
"musicSinger": "苏小花",
"musicLink": "http://cctv3.qiniudn.com/huaxindenanren.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/huaxindenanren.lrc",
"musicTime": "03:57",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "兄弟难当",
"musicSinger": "杜歌",
"musicLink": "http://cctv3.qiniudn.com/xiongdinandang.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/xiongdinandang.lrc",
"musicTime": "04:12",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
]
},
{
"albumName": "DJ舞曲",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/dj.jpg",
"albumSong": [
{
"musicName": "唐伯虎点秋香",
"musicSinger": "过江龙",
"musicLink": "http://cctv3.qiniudn.com/tbhdqx.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/tbhdqx.lrc",
"musicTime": "04:41",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "宁德皇庭俱乐部串烧",
"musicSinger": "宁德皇庭",
"musicLink": "http://cctv3.qiniudn.com/ndht.mp3",
"lyricsLink": "",
"musicTime": "60:06",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "爱中过枪dj",
"musicSinger": "门丽",
"musicLink": "http://cctv3.qiniudn.com/azgq.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/azgq.lrc",
"musicTime": "04:57",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "继续孤独DJ",
"musicSinger": "张祥洪",
"musicLink": "http://cctv3.qiniudn.com/jxgd.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/jxgd.lrc",
"musicTime": "06:04",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/jxgd.jpg"
},
{
"musicName": "真心至上dj",
"musicSinger": "DJ",
"musicLink": "http://cctv3.qiniudn.com/zxzs.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/zxzs.lrc",
"musicTime": "06:59",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "彻彻底底忘记你是谁dj",
"musicSinger": "陈咏",
"musicLink": "http://cctv3.qiniudn.com/ccddwjnss.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/ccddwjnss.lrc",
"musicTime": "06:59",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "痛心疾首dj",
"musicSinger": "浩轩",
"musicLink": "http://cctv3.qiniudn.com/tongxinjishou.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/tongxinjishou.lrc",
"musicTime": "05:01",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "不爱我就不要给我机会dj",
"musicSinger": "乐桐",
"musicLink": "http://cctv3.qiniudn.com/bawjbygwjh.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/bawjbygwjh.lrc",
"musicTime": "05:45",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
]
},
{
"albumName": "流行红歌",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/lx.jpg",
"albumSong": [
{
"musicName": "新娘不是我",
"musicSinger": "程响",
"musicLink": "http://cctv3.qiniudn.com/xnbsw.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/xnbsw.lrc",
"musicTime": "04:42",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "小苹果",
"musicSinger": "筷子兄弟 ",
"musicLink": "http://cctv3.qiniudn.com/xiaopingguo.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/xiaopingguo.lrc",
"musicTime": "03:31",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "你并不在意我爱你",
"musicSinger": "邱宏",
"musicLink": "http://cctv3.qiniudn.com/nbbzywan.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/nbbzywan.lrc",
"musicTime": "03:57",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
]
},
{
"albumName": "伤感情歌",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/qg.jpg",
"albumSong": [
{
"musicName": "丢了爱情丢了你",
"musicSinger": "高信",
"musicLink": "http://cctv3.qiniudn.com/dlaqdln.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/dlaqdln.lrc",
"musicTime": "03:47",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "苦果",
"musicSinger": "程响",
"musicLink": "http://cctv3.qiniudn.com/kuguo.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/kuguo.lrc",
"musicTime": "03:53",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "留不住你的温柔",
"musicSinger": "李泽坚&司徒兰芳",
"musicLink": "http://cctv3.qiniudn.com/liubuzhunidewenrou.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/liubuzhunidewenrou.lrc",
"musicTime": "03:55",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "最幸福的人",
"musicSinger": "曾春年",
"musicLink": "http://cctv3.qiniudn.com/zuixingfuderen.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/zuixingfuderen.lrc",
"musicTime": "04:36",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "辜负",
"musicSinger": "楼宏章",
"musicLink": "http://cctv3.qiniudn.com/gufu.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/gufu.lrc",
"musicTime": "04:09",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
}
]
},
{
"albumName": "怀旧歌曲",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/zzg.jpg",
"albumSong": [
{
"musicName": "捉泥鳅",
"musicSinger": "卓依婷",
"musicLink": "http://cctv3.qiniudn.com/zhuoniqiu.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/zhuoniqiu.lrc",
"musicTime": "02:38",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "记事本",
"musicSinger": "陈慧琳",
"musicLink": "http://cctv3.qiniudn.com/jishiben.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/jishiben.lrc",
"musicTime": "04:13",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "孤独的人并不寂寞",
"musicSinger": "雷婷",
"musicLink": "http://cctv3.qiniudn.com/gddrbbjm.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/gddrbbjm.lrc",
"musicTime": "04:32",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
{
"musicName": "偏偏喜欢你-古筝音乐",
"musicSinger": "段银莹",
"musicLink": "http://cctv3.qiniudn.com/ppxhn.mp3",
"lyricsLink": "",
"musicTime": "04:21",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/min/hcsmlive.png"
},
]
},
{
"albumName": "我的翻唱",
"albumCoverMax": "http://www.wuover.com/wp-content/themes/QIUYE/music/albumCover/max/qiuye.jpg",
"albumSong": [
{
"musicName": "只想一生跟你走",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-zxysgnz.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-zxysgnz.lrc",
"musicTime": "04:52",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "为爱停留",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-weiaitingliu.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-weiaitingliu.lrc",
"musicTime": "05:38",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "为什么相爱的人不能在一起",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-wsmxadrbnzyq.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-wsmxadrbnzyq.lrc",
"musicTime": "04:28",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "戒掉爱情戒掉你",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-jdaqjdn.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-jdaqjdn.lrc",
"musicTime": "03:58",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "你到底有没有爱过我",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-nddymyagw.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-nddymyagw.lrc",
"musicTime": "04:03",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "在心里从此永远有个你",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-zxlccyyygn.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-zxlccyyygn.lrc",
"musicTime": "04:25",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "我不后悔",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-wbhh.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-wbhh.lrc",
"musicTime": "04:04",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "偷偷联系",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-toutoulianxi.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-toutoulianxi.lrc",
"musicTime": "04:16",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "红尘情歌",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-hcqg.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-hcqg.lrc",
"musicTime": "03:29",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "思思念念全是你",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-ssnnqsn.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-ssnnqsn.lrc",
"musicTime": "04:07",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "爱上别人的人",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-asbrdr.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-asbrdr.lrc",
"musicTime": "03:47",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
{
"musicName": "爱情码头",
"musicSinger": "秋叶",
"musicLink": "http://cctv3.qiniudn.com/qiuye-aqmt.mp3",
"lyricsLink": "http://www.wuover.com/wp-content/themes/QIUYE/music/lyrics/qiuye-aqmt.lrc",
"musicTime": "04:57",
"albumCoverMin": "http://www.wuover.com/wp-content/themes/QIUYE/images/touxiang.gif"
},
]
}
],
"songNum": 13
}
</code>
5、附播放器背景图片一张
