1 Star 0 Fork 0

阳阳/简单的音乐平台的官网

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
文件
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
index.html 11.57 KB
一键复制 编辑 原始数据 按行查看 历史
chengqiong 提交于 2018-12-06 17:39 . zengjiamusic
<!DOCTYPE HTML>
<head>
<title>恒远科技</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all"/>
<link href="css/slider.css" rel="stylesheet" type="text/css" media="all"/>
<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="js/jquery.nivo.slider.js"></script>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>
</head>
<style>
.logo>a>img{
width: 165px;
}
</style>
<body>
<div class="header">
<div class="header_top">
<div class="wrap">
<div class="logo">
<a href="index.html"><img src="images/logo.png" alt="" /></a>
</div>
<div class="menu">
<ul>
<li class="active"><a href="index.html">首页</a></li>
<li><a href="about.html">关于</a></li>
<!--<li><a href="events.html">新闻</a></li>-->
<!--<li><a href="gallery.html">展馆</a></li>-->
<!--<li><a href="blog.html">博客</a></li>-->
<li><a href="contact.html">联系我们</a></li>
<div class="clear"></div>
</ul>
<div class="clear"></div>
</div>
</div>
<!------ Slider ------------>
<div class="wrap">
<div class="slider">
<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<img src="images/banner4.jpg" data-thumb="images/banner4.jpg" alt="" />
<img src="images/banner2.jpg" data-thumb="images/banner2.jpg" alt="" />
<img src="images/banner3.jpg" data-thumb="images/banner3.jpg" alt="" />
<img src="images/banner1.jpg" data-thumb="images/banner1.jpg" alt="" />
<!--<img src="images/5.jpg" data-thumb="images/5.jpg" alt="" />-->
<!--<img src="images/1.jpg" data-thumb="images/1.jpg" alt="" />-->
<!--<img src="images/2.jpg" data-thumb="images/2.jpg" alt="" />-->
<!--<img src="images/3.jpg" data-thumb="images/3.jpg" alt="" />-->
<!--<img src="images/4.jpg" data-thumb="images/4.jpg" alt="" />-->
<!--<img src="images/5.jpg" data-thumb="images/5.jpg" alt="" />-->
</div>
</div>
</div>
</div>
<!------End Slider ------------>
</div>
<div class="main">
<div class="wrap">
<div class="section group">
<div class="listview_1_of_3 images_1_of_3 event_grid">
<a href="index.html">
<div class="listimg listimg_1_of_2">
<img src="images/banner1.jpg" alt="" />
</div>
<div class="text list_1_of_2">
<div class="date">
<figure>No.1</figure>
</div>
</div></a>
</div>
<div class="listview_1_of_3 images_1_of_3 event_grid">
<a href="index.html">
<div class="listimg listimg_1_of_2">
<img src="images/banner2.jpg" alt="" />
</div>
<div class="text list_1_of_2">
<div class="date">
<figure>No.2</figure>
</div>
</div>
</a>
</div>
<div class="listview_1_of_3 images_1_of_3 event_grid">
<a href="index.html">
<div class="listimg listimg_1_of_2">
<img src="images/my1.jpg" alt="" />
</div>
<div class="text list_1_of_2">
<div class="date">
<figure>No.3</figure>
</div>
</div>
</a>
</div>
</div>
<div class="copyrights">Collect from <a href="http://www.cssmoban.com/" >手机网站模板</a></div>
<div class="content_bottom">
<div class="section group">
<div class="col_1_of_4 span_1_of_4 today_show">
<h3>热门推荐</h3>
<img src="images/my3.jpg" alt="" />
<h5><span></span></h5>
<!--<h5>《Till the World Ends》是美国女歌手布兰妮·斯皮尔斯演唱的一首流行舞曲,歌词主要由Ke$ha创作,马克斯·马丁和Dr. Luke负责歌曲的曲谱、音乐出版。该歌曲收录在布兰妮·斯皮尔斯于2011年3月25日发行的第七张录音室专辑《Femme Fatale》,并作为推广专辑的第二波单曲,于2011年3月4日通过Jive唱片公司发布</h5>-->
<!--<a href="#" class="button">更多</a>-->
</div>
<div class="col_1_of_4 span_1_of_4">
<h3>新歌推荐</h3>
<div class="track_list">
<ul>
<li>
<a href="javascript:;" class="music" data-id="aud13">甜甜蜜蜜的永远-郭宇飞
<audio id="aud13">
<source src="music/甜甜蜜蜜的永远-郭宇飞.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud7">我不哭-宋莹莹
<audio id="aud7">
<source src="music/我不哭-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud8">我爱-宋莹莹
<audio id="aud8">
<source src="music/我爱-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud9">我的好妈妈-宋莹莹
<audio id="aud9">
<source src="music/我的好妈妈-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud10">我的酒爹-宋莹莹
<audio id="aud10">
<source src="music/我的酒爹-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud15">雏菊花-宋莹莹
<audio id="aud15">
<source src="music/雏菊花-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud16">行军歌-宋莹莹
<audio id="aud16">
<source src="music/行军歌-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud17">等待秋天-宋莹莹
<audio id="aud17">
<source src="music/等待秋天-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
</ul>
</div>
</div>
<div class="col_1_of_4 span_1_of_4">
<h3>热门歌曲</h3>
<div class="track_list">
<ul>
<li>
<a href="javascript:;" class="music" data-id="aud1">不要爱得不知所措-宋莹莹
<audio id="aud1">
<source src="music/不要爱得不知所措-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud2">乒乓梦-宋莹莹
<audio id="aud2">
<source src="music/乒乓梦-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud11">失去是什么-郭宇飞
<audio id="aud11">
<source src="music/失去是什么-郭宇飞.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud3">二姐-宋莹莹
<audio id="aud3">
<source src="music/二姐-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud4">关怀-宋莹莹
<audio id="aud4">
<source src="music/关怀-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud12">谁能明白我的真心-郭宇飞
<audio id="aud12">
<source src="music/谁能明白我的真心-郭宇飞.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud5">军旗飘扬-宋莹莹
<audio id="aud5">
<source src="music/军旗飘扬-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
<li>
<a href="javascript:;" class="music" data-id="aud6">同舟同家-宋莹莹
<audio id="aud6">
<source src="music/同舟同家-宋莹莹.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</a>
</li>
</ul>
</div>
</div>
<div class="col_1_of_4 span_1_of_4">
<h3>最新资讯</h3>
<a href="index.html"><img src="images/my4.png" alt="" /></a>
<!--<p>《伟大的渺小》是林俊杰于2017年12月29日发行的专辑,共收录11首歌曲,由林俊杰和许环良担纲专辑制作人。-->
<!--2018年,该专辑获得亚洲影响力大典颁奖典礼亚洲影响力最佳专辑奖。林俊杰凭借该专辑获得第二届唱工委音乐奖年度男歌手奖。</p>-->
<!--<a href="index.html" class="button">更多</a>-->
</div>
</div>
</div>
</div>
</div>
<div id="page2"></div>
<script>
$("#page2").load("foot.html");
var audios = document.getElementsByTagName("audio");
// 暂停函数
function pauseAll() {
var self = this;
[].forEach.call(audios, function (i) {
// 将audios中其他的audio全部暂停
i !== self && i.pause();
})
}
// 给play事件绑定暂停函数
[].forEach.call(audios, function (i) {
i.addEventListener("play", pauseAll.bind(i));
})
$(".music").click(function(){
var aud_id = $(this).data('id');
var aud = document.getElementById(aud_id);
if (aud.paused) {
aud.play();
} else {
aud.pause();
}
});
// var img = document.getElementById("playpause");
// img.onclick = function() {
// if (aud.paused) {
// aud.play();
// } else {
// aud.pause();
// }
// }
// aud.addEventListener("play", function (e) {
// img.src="pause.png";
// }, false);
// aud.addEventListener("pause", function (e) {
// img.src="play.png";
// }, false);
</script>
</body>
</html>
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化
JavaScript
1
https://gitee.com/aqiong_admin/musicWebsite.git
git@gitee.com:aqiong_admin/musicWebsite.git
aqiong_admin
musicWebsite
简单的音乐平台的官网
master

搜索帮助

0d507c66 1850385 C8b1a773 1850385