很多人看过本站的音乐台后都来找我要源码想自己搞一个,今天就整理出来发给大家!
<iframe src="http://app.duomiyy.com/webradio/duba/?t=1384680754861" scrolling="no" frameborder="0" rel="nofollow" style="margin: 0px; overflow: hidden; text-align: center; padding: 0px; width: 100%; height: 100%">
这是多米音乐播放器代码,也是最基本的部分,如果您要更改或增加播放器数量,可以查找相关代码添加即可,下面function部分是音乐台代码集合,点了按钮后,就会从function这里提取相应代码显示出来,这里的代码需要转换才可加入
- 转换工具
css代码中的图片链接被我注释掉了,它的作用是当<div id="player"></div>中间是空的时,也就是刚打开页面是不自动播放得,只显示一张图片,当点击按钮时才会播放,我嫌太麻烦,就放了个播放器进去,然后注释掉了图片,如果您想刚进播放页面时,不自动播放而是显示图片,去掉23行<div id="player"></div>中间的那个iframe,然后再在css中放上图片链接去掉两头的/ /即可!
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<link rel="stylesheet" type="text/css" media="all" href="music.css">
</head>
<body class="musicbody">
<div class="textbox">
<a class="button blue" href="javascript:;" onclick="duomi()">多米FM</a>
<a class="button blue" href="javascript:;" onclick="baidu()">百度FM</a>
<a class="button blue" href="javascript:;" onclick="kugou()">酷狗FM</a>
<a class="button blue" href="javascript:;" onclick="sina()">乐库FM</a>
<a class="button blue" href="javascript:;" onclick="xiami()">虾米FM</a>
<a class="button blue" href="javascript:;" onclick="duole()">多乐FM</a>
<a class="button blue" href="javascript:;" onclick="douban()">豆瓣FM</a></div>
<SCRIPT type='text/javascript' src="http://lib.sinaapp.com/js/jquery/1.8.2/jquery.min.js"></SCRIPT>
<script>if (!window.jQuery) {
document.write(unescape("%3Cscript src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js?cdnversion=" + Math.ceil(new Date() / 3600000) + "' type='text/javascript'%3E%3C/script%3E"))
}</script>
<div class="mainbody">
<div id="player" class="player">
<iframe src="http://app.duomiyy.com/webradio/duba/?t=1384680754861" scrolling="no" frameborder="0"
rel="nofollow"
style="margin: 0px; overflow: hidden; text-align: center; padding: 0px; width: 100%; height: 100%"></iframe>
</div>
<script type="text/javascript">function douban() {
try {
_hmt.push(["_trackEvent", "fm", "douban", ""])
} catch (a) { }
$("#player").html(unescape("%3Ciframe%20src%3D%22http%3A%2F%2Fdouban.fm%2Fpartner%2Fplayerhao123%22%20scrolling%3D%22no%22%20frameborder%3D%220%22%20rel%3D%22nofollow%22%20style%3D%22margin%3A%200px%3B%20overflow%3A%20hidden%3B%20text-align%3A%20center%3B%20padding%3A%200px%3B%20width%3A%20100%25%3B%20height%3A%20100%25%22%3E%3C%2Fiframe%3E"))
}
function duole() {
try {
_hmt.push(["_trackEvent", "fm", "douban", ""])
} catch (a) { }
$("#player").html(unescape("%3Ciframe%20src%3D%22http%3A%2F%2Fwww.duole.com%2Fapplication%2Fqihu360%2F%22%20scrolling%3D%22no%22%20frameborder%3D%220%22%20rel%3D%22nofollow%22%20style%3D%22margin%3A%200px%3B%20overflow%3A%20hidden%3B%20text-align%3A%20center%3B%20padding%3A%200px%3B%20width%3A%20100%25%3B%20height%3A%20100%25%22%3E%3C%2Fiframe%3E"))
}
function xiami() {
try {
_hmt.push(["_trackEvent", "fm", "xiami", ""])
} catch (a) { }
$("#player").html(unescape("%3Ciframe%20src%3D%22http%3A%2F%2Fwww.xiami.com%2Fkuang%2Fhao123%2F%22%20scrolling%3D%22no%22%20frameborder%3D%220%22%20%20rel%3D%22nofollow%22%20style%3D%22margin%3A%200px%3B%20overflow%3A%20hidden%3B%20text-align%3A%20center%3B%20padding%3A%200px%3B%20width%3A%20100%25%3B%20height%3A%20100%25%22%3E%3C%2Fiframe%3E"))
}
function duomi() {
try {
_hmt.push(["_trackEvent", "fm", "kuwo", ""])
} catch (a) { }
$("#player").html(unescape("%3Ciframe%20src%3D%22http%3A%2F%2Fapp.duomiyy.com%2Fwebradio%2Fduba%2F%3Ft%3D1384680754861%22%20scrolling%3D%22no%22%20frameborder%3D%220%22%20rel%3D%22nofollow%22%20style%3D%22margin%3A%200px%3B%20overflow%3A%20hidden%3B%20text-align%3A%20center%3B%20padding%3A%200px%3B%20width%3A%20100%25%3B%20height%3A%20100%25%22%3E%3C%2Fiframe%3E"))
}
function sina() {
try {
_hmt.push(["_trackEvent", "fm", "sina", ""])
} catch (a) { }
$("#player").html(unescape("%3Ciframe%20src%3D%22http%3A%2F%2Fmusic.sina.com.cn%2Fapp%2Fbaidu%2Findex.php%22%20scrolling%3D%22no%22%20frameborder%3D%220%22%20rel%3D%22nofollow%22%20style%3D%22margin%3A%200px%3B%20overflow%3A%20hidden%3B%20text-align%3A%20center%3B%20padding%3A%200px%3B%20width%3A%20100%25%3B%20height%3A%20100%25%22%3E%3C%2Fiframe%3E"))
}
function baidu() {
try {
_hmt.push(["_trackEvent", "fm", "baidu", ""])
} catch (a) { }
$("#player").html(unescape("%3Ciframe%20src%3D%22http%3A%2F%2Ffm.baidu.com%2F%3Fembed%3Dps%26bd_user%3D1932593848%26bd_sig%3D6b9ee2781b35317af1fc2f596ddcce10%26canvas_pos%3Dplatform%22%20scrolling%3D%22no%22%20frameborder%3D%220%22%20rel%3D%22nofollow%22%20style%3D%22margin%3A%200px%3B%20overflow%3A%20hidden%3B%20text-align%3A%20center%3B%20padding%3A%200px%3B%20width%3A%20100%25%3B%20height%3A%20100%25%22%3E%3C%2Fiframe%3E"))
}
function kugou() {
try {
_hmt.push(["_trackEvent", "fm", "kugou", ""])
} catch (a) { }
$("#player").html(unescape("%3Ciframe%20src%3D%22http%3A%2F%2Ftopic.kugou.com%2Fradio%2F%22%20scrolling%3D%22no%22%20frameborder%3D%220%22%20%20rel%3D%22nofollow%22%20style%3D%22margin%3A%200px%3B%20overflow%3A%20hidden%3B%20text-align%3A%20center%3B%20padding%3A%200px%3B%20width%3A%20100%25%3B%20height%3A%20100%25%22%3E%3C%2Fiframe%3E"))
}</script>
</div>
</body>
</html>
.button,.button:visited{display:inline-block;padding:5px 10px 6px;color:#fff;text-decoration:none;-moz-border-radius:3px;-webkit-border-radius:3px;-moz-box-shadow:0 1px 3px rgba(0,0,0,0.6);-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.6);text-shadow:0 -1px 1px rgba(0,0,0,0.25);border-bottom:1px solid rgba(0,0,0,0.25);position:relative;cursor:pointer}
.button:hover{background-color:#111;color:#fff}.button:active{top:1px}
.button,.button:visited {font-size:13px;font-weight:bold;line-height:1;text-shadow:0 -1px 1px rgba(0,0,0,0.25)}
.blue.button,.blue.button:visited{background-color:#FB4F4F}
.blue.button:hover{background-color:#2575cf}
.musicbody {text-align: center;font: normal 14px/24px "Microsoft Yahei","冬青黑体简体中文 w3","宋体";} button{cursor: pointer;} .button blue a{text-decoration:none;color:#369;} .button blue a:hover{text-decoration:underline;} p {margin-bottom:10px;height: 100%;} blockquote{border-left: 5px solid #dadada;padding: 10px 15px;background: #f1f1f1;margin-bottom: 10px;}
.button blue a:link {text-decoration: none;}
.button blue a:visited {text-decoration: none;}
.button blue a:hover {text-decoration: none;}
.button blue a:active {text-decoration: none;}
.textbox {text-align: center;padding:15px;}
.player {align: center;width:100%;height:520px;/*background:url(图片链接) center center no-repeat;*/}