-
Notifications
You must be signed in to change notification settings - Fork 2
/
index-v1.html
313 lines (290 loc) · 11.4 KB
/
index-v1.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
<meta name="keywords" content="梅子丹"/>
<meta name="description" content="梅子丹"/>
<title>梅子丹</title>
<style type="text/css">
html,
body {
height: 100%;
width: 100%;
padding: 0;
margin: 0;
overflow: hidden;
-webkit-text-size-adjust: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
font-family: '新蒂赵孟頫体', Helvetica Neue, Helvetica, microsoft yahei, arial, STHeiTi, sans-serif, simhei;
}
::-webkit-scrollbar {
width: 2px;
height: 2px;
}
::-webkit-scrollbar-track-piece {
background-color: rgba(255, 255, 255, 0);
}
::-webkit-scrollbar-thumb:vertical {
background-color: rgba(255, 255, 255, 0.1);
}
::-webkit-scrollbar-thumb:horizontal {
background-color: rgba(255, 255, 255, 0.1);
}
//@font-face {
// font-family: '迷你简硬笔行书';
// src: url('http://ohjr3xer5.bkt.clouddn.com/%E8%BF%B7%E4%BD%A0%E7%AE%80%E7%A1%AC%E7%AC%94%E8%A1%8C%E4%B9%A6.TTF');
//}
@font-face {
font-family: '新蒂文徵明';
src: url('http://ohjr3xer5.bkt.clouddn.com/%E6%96%B0%E8%92%82%E6%96%87%E5%BE%B5%E6%98%8E.ttf');
}
@font-face {
font-family: '新蒂赵孟頫体';
src: url('http://ohjr3xer5.bkt.clouddn.com/%E6%96%B0%E8%92%82%E8%B5%B5%E5%AD%9F%E9%A0%AB%E4%BD%93.ttf');
}
body {
position: relative;
display: flex;
background: url(http://ohjr3xer5.bkt.clouddn.com/rain.jpg) no-repeat;
background-size: 100% 104%;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
}
.wuxia {
transform: translate(-50%, -50%);
position: absolute;
top: 50%;
left: 4%;
width: 20px;
color: #e7e7e7;
font-size: 2rem;
font-family:'新蒂文徵明';
font-weight: bold;
text-shadow: 5px 0px 1px #6f6f6f;
}
.sky {
height: 100%;
width: 100%;
display: flex;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
@-webkit-keyframes rainDrop {
0% {
background-position: 0 0;
}
100% {
background-position: -1300px 1035px;
}
}
@-moz-keyframes rainDrop {
0% {
background-position: 0 0;
}
100% {
background-position: -1300px 1035px;
}
}
.rain,
.leaves {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.rain {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
background: url(http://ohjr3xer5.bkt.clouddn.com/rain-8.png) 0 0;
opacity: .4;
-webkit-animation-name: rainDrop;
animation-name: rainDrop;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-duration: 1.2s;
animation-duration: 1.2s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.title {
font-size: 32px;
}
#write {
background: rgba(255, 255, 255, .2);
width: 55%;
max-height: 95%;
overflow-y: auto;
overflow-x: auto;
font-family: inherit;
}
.bg {
filter: blur(10px);
height: 100%;
width: 100%;
}
@media screen and (max-width: 450px) {
body {
display: flex;
background: url(http://ohjr3xer5.bkt.clouddn.com/rain.jpg) 70% 0% no-repeat;
background-size: 150% 104%;
}
#write {
width: 68%;
padding: .5rem;
margin-left: 2.5rem;
}
.wuxia {
left: 8%;
}
}
</style>
<link href='http://cdn.webfont.youziku.com/webfonts/nomal/95626/19650/58da0549f629da16400dde85.css' rel='stylesheet'
type='text/css'/>
</head>
<body>
<div class="wuxia">道可道，非常道。</div>
<audio src="http://ohjr3xer5.bkt.clouddn.com/3343614861307841.mp3" preload="auto" autoplay="autoplay" id="audio"
loop="loop"></audio>
<div class="sky">
<div class="rain"></div>
<div class="leaves"></div>
</div>
<div class="title">
</div>
<pre id="write" class="css9b8cdef141758a">
</pre>
<pre id="read" style="display: none;">
作曲 : 明日天涯的KOKI
作词 : 清彦
【STAFF】
策划：清彦 喵草鞋 编/导/统筹：喵草鞋 作词：清彦 作曲/歌后：明日天涯的KOKI
编曲：王朝 二胡：丁老师 歌手：五色石南叶&Aki阿杰 分轨混音：黑玩偶
剧情后期：凌檬 视频/制图：嫣儿 海报：公子蘇笙
【CAST】（按出场顺序排列）
幼年陈月：蓦浅浅 幼年毛毛：洛少爷 莫雨：K-星河 毛毛：吴骁一 烟：秦且歌 影：沐帮主
谷之岚：杜冥鸦 祁进：鲁有脚（姜广涛） 康雪烛：藤新 陶寒亭：阿春 王遗风：龙吟 谢渊：宝木中阳
孙飞亮：湖畔里的鱼（沈达威） 曲云：乔绫 卓婉清：maggie 慕容追风：天海无贝 小陆烟儿：汐玥
陆烟儿：纪川久 卫栖梧：倒吊男 公孙盈：薄荷君 公孙幽：萋萋 沈眠风：petboy 月弄痕：喵草鞋
小七：山新 李承恩：轩zone 李复：Amuro 秋叶青：杨一 风夜北：阿杰729
【正文】
【剧情】回不去的年少时光
（稻香村 孩童嬉戏的声音 做场景铺垫）
幼年陈月念童谣：杨柳青青着地垂,杨花漫漫搅天飞。柳条折尽花飞尽,借问行人归不归?
幼年毛毛：（哭喊）莫雨哥哥！！！（坠入深渊感）【转场】
【入前奏】
莫雨：毛毛....
毛毛：大哥...离开恶人谷吧，跟我回家！
莫雨：走过三生路..便不会再回头！
毛毛：莫雨哥哥....我...
莫雨：我们，已经回不去了！
烟：天旋影，就此江湖不相逢...
影：不灭烟，就此江湖不相逢...
【歌词】
五哥：
看水车咿呀转着声声响 又闻稻花香
老牛正安睡在竹林旁
阿姐：
小桥下河水你呀慢慢淌 蝉鸣在低唱
回不去的年少时光
【剧情】跨不过的生和死
康雪烛：纵然我已领悟雕刻极致境界，吾妻已逝...又有何意义！
陶寒亭：自紫霞枉死那日起，世上再无白衣孟尝陶寒亭了！！！！
王遗风：我不该踏雪而来，她便不会饮血而去。
【剧情】抹不平的信任危机
谢渊：王谷主，当年之事，你却为何不解释？
王遗风：解释了又如何？
谢渊：是了，恐怕解释了，也无人信你,不过是人心之争。.终归是善恶之争。
【剧情】逃不掉的两相别离
祁进：之岚....(痛苦呻吟)
（回忆）谷之岚：血海深仇是你……情之所钟是你…
祁进：我要在华山等一个人回来……（失忆后意识不清，却还记得曾经的诺言）
（回忆）谷之岚：祁进，我要你好好活着！（背着祁进 艰难的前行）
祁进：我好像，忘了她的名字……
谷之岚：忘了……谷之岚（谷之岚喂了祁进喝下忘情水，一边让祁进忘了自己）
祁进：忘了……谷……之岚……
【歌词】
阿姐（五哥）
犹记落星湖畔雪纷扬 一夜埋葬（那场雪 纷扬间将过往都埋葬）
他曾轻许下流光 皆赋作离殇（曾许下流光）
各终老一方 白首相忘（各终老一方 白首相忘）
五哥（阿姐）
【剧情】不能一起白发苍苍
孙飞亮：我知道，师姐心里的人不是我...若是哪天师姐遇到危险，我可以为她死...她就能记住我了吧。
曲云：阿亮！！！！！！！！！！！！！！师姐...心里有你了....你看看我啊....
孙飞亮：（毒尸嘶吼声）
卓婉清：厌厌良人，秩秩德音....（慢慢尸化，音色表现出很痛苦，被极致病痛折磨低吟，不愿沉睡）这辈子...下辈子...你都是我的良人..追...风...
慕容追风：婉清，你自可好眠。待你醒来...我仍会守在你身边。（一边说一边温柔抱起变成尸人的夫人，把夫人放进棺材里，背起来继续战斗）
【剧情】婚礼的祝福
少时陆烟儿：七叔...等烟儿长大了，就去长安找你！
卫栖梧：哈哈哈哈！好！七叔等着你！
陆烟儿：可如今...长安月下已无长风万里。
卫栖梧：只有为小叶子而活的卫栖梧。
陆烟儿：若是七叔成婚了，哪怕我心中难过也会祝福的吧...
【从并肩到对立】
公孙盈：为什么？！既生盈何生幽！！（执念，几近疯狂！）
公孙幽：情之一字，最是伤人...
沈眠风：你知道，我杀尽天下人，却不会伤害你。
月弄痕：我只知道...你是背信弃义的沈眠风！而我爱的人..早就已经死了！
沈眠风：其实我一直很想你。
【歌词】
五哥：
听早春细雨滴答落秀坊 晕开桃花香
染红了彼岸云的方向
阿姐：
目光遥望荒凉的洛道上 有人在流浪
长风过处徒留沧桑
【剧情】永远无法得到的你
李承恩：我曾辜负过一个女子..现在，我不想再辜负你。(看起来是表白，实则是拒绝)
小七：我已在最好的年华跟随你踏遍四海，十年了，小七没有遗憾，亦不后悔。
李承恩：七姑娘，就此珍重。（感慨万分，内心还是不舍的）
小七：李承恩，再也不见。（心里绝望，强忍住决绝离别）
李 复：青身莫轻身，复心不负心。
秋叶青：入我相思门，知我相思苦....
仍记白衣同明月而来 相思暗藏（那一夜 明月皎皎将相思暗藏）
【歌词】
【歌词】
阿姐（五哥）
惟愿再逢于良夜 还是旧容样（愿再逢良夜）
却尘世游离 死生不往（却尘世游离 死生不往）
五哥（阿姐）
风夜北：自入江湖，繁华过眼，红尘虚度 ，唯记平生应思量
</pre>
</body>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script language="javascript">
var index = 0;
var word = document.getElementById("read").innerHTML;
var write = document.getElementById("write")
function type() {
write.innerHTML = word.substring(0, index++);
write.scrollTop = write.scrollHeight;
if (index>word.length) {
window.clearInterval(sl);
}
}
var sl = setInterval(type, 200);
function autoPlayAudio() {
wx.config({
debug: false,
appId: '',
timestamp: 1,
nonceStr: '',
signature: '',
jsApiList: []
});
wx.ready(function() {
var globalAudio=document.getElementById("audio");
globalAudio.play();
});
};
autoPlayAudio();
</script>
</html>