Skip to content

Commit b82f973

Browse files
author
邱钰杰
committed
界面优化
1 parent 745e7b4 commit b82f973

27 files changed

+427
-313
lines changed

‎audio.html‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<meta charset="utf-8">
6+
<link href="lib/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet" type="text/css" />
7+
<link href="css/style.css" rel="stylesheet" type="text/css" />
8+
</head>
9+
10+
<body>
11+
<div class="bodydiv" id="bodydiv01">
12+
<div class="bodydiv" id="bodydiv02"></div>
13+
</div>
14+
15+
<audio crossOrigin="anonymous" <!--controls="controls" -->
16+
src="" ></audio>
17+
<div id="div-canvas">
18+
<span id="startTime">0:00</span>
19+
<span id="endTime">0:00</span>
20+
<canvas id='canvas'> </canvas>
21+
</div>
22+
23+
<div id="audio-custom">
24+
<div id="div-lightBox"></div>
25+
26+
<div id="light"></div>
27+
<span class="glyphicon glyphicon-play" id="play"></span>
28+
<span class="glyphicon glyphicon-step-forward" id="next"></span>
29+
</div>
30+
31+
<input type="file" multiple />
32+
33+
<script src="lib/jquery/2.0.0/jquery.min.js"></script>
34+
<script src="js/audio.js"></script>
35+
<script src="js/drop.js"></script>
36+
<script src="js/backgroundImg.js"></script>
37+
</body>
38+
39+
</html>

‎audio/au0.mp3‎

-4.45 MB
Binary file not shown.

‎audio/au1.mp3‎

-4.2 MB
Binary file not shown.

‎css/mycss/style.css‎

Lines changed: 0 additions & 89 deletions
This file was deleted.

‎css/style.css‎

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
@keyframes animeLight {
2+
0% {
3+
left: -8px;
4+
}
5+
100% {
6+
left: 797px;
7+
}
8+
}
9+
10+
.bodydiv {
11+
position: absolute;
12+
width: 100%;
13+
height: 100%;
14+
background-size: cover;
15+
z-index: -10;
16+
}
17+
18+
#div-canvas {
19+
width: 100%;
20+
height: 80%;
21+
text-align: center;
22+
}
23+
24+
#canvas {
25+
/*background-color: rgba(255, 255, 255, 0.3);*/
26+
border-bottom-style: solid;
27+
border-bottom-color: rgba(255, 255, 255, 0.9);
28+
border-bottom-width: 2px;
29+
}
30+
31+
#div-lightBox {
32+
height: 4px;
33+
bottom: 8px;
34+
position: relative;
35+
cursor: pointer;
36+
}
37+
38+
#div-lightBox:hover {
39+
box-shadow: 0px 0px 2px 1px rgba(65, 189, 216, 0.9);
40+
}
41+
42+
#light {
43+
position: relative;
44+
bottom: 18px;
45+
left: -8px;
46+
height: 16px;
47+
width: 16px;
48+
border-radius: 8px;
49+
/*background-color: rgba(255,249,228,0.9);
50+
box-shadow:0px 0px 1px 1px rgba(255,245,207,0.9),0px 0px 5px 2px rgba(255,245,207,0.9);*/
51+
background-color: rgba(0, 165, 208, 1);
52+
cursor: pointer;
53+
}
54+
55+
#light:hover {
56+
box-shadow: 0px 0px 1px 1px rgba(0, 165, 208, 0.9), 0px 0px 5px 2px rgba(0, 165, 208, 0.9);
57+
}
58+
59+
#audio-custom {
60+
width: 100%;
61+
text-align: center;
62+
}
63+
64+
#audio-custom span {
65+
color: rgba(0, 255, 210, 0.7);
66+
font-size: 20px;
67+
margin: 10px 20px 10px 20px;
68+
}
69+
70+
#audio-custom span:hover {
71+
color: rgba(0, 213, 213, 0.9);
72+
cursor: pointer;
73+
}
74+
75+
#audio-custom span:active {
76+
color: rgba(0, 190, 190, 0.9);
77+
}
78+
79+
#startTime {
80+
font-size: 20px;
81+
position: relative;
82+
color: rgba(0, 190, 190, 0.9);
83+
}
84+
85+
#endTime {
86+
font-size: 20px;
87+
position: relative;
88+
color: rgba(0, 190, 190, 0.9);
89+
}
90+
91+
input[type="file"] {
92+
display: none;
93+
}

‎img/backgroundImg.js‎

Lines changed: 0 additions & 31 deletions
This file was deleted.

‎img/bodydiv.html‎

Lines changed: 0 additions & 12 deletions
This file was deleted.

0 commit comments

Comments
 (0)