-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
171 lines (160 loc) · 8.38 KB
/
index.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
<!DOCTYPE html>
<head>
<title>送给我的丝丝</title>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta content="telephone=no" name="format-detection">
<style type="text/css">
body,
html,
#container {
width: 100%;
height: 100%;
overflow: hidden;
margin: 0;
font-family: "微软雅黑";
}
.content {
padding-left: 18px;
padding-right: 18px;
font-size: 16px;
font-weight: 400;
line-height: 1.7;
color: #2f2f2f;
}
.downico {
position: absolute;
bottom: 60px;
left: 50%;
margin-left: -30px;
}
.aimg {
width: 100%;
}
</style>
<script type="text/javascript" src="https://api.map.baidu.com/getscript?v=2.0&ak=sdRjUvngwImdkL3oGpcGvmMS8DOWeHSH"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/3.0.4/fullpage.min.css" />
</head>
<body>
<div id="fullpage">
<div class="section" data-anchor="start">
<img src="./img/screen.png" />
</div>
<div class="section" data-anchor="map">
<div id="container"></div>
</div>
<div class="section" data-anchor="content1">
<div class="content">
<p>4月11日，一夜无眠，思念像毒药一样蔓延，却只能苦苦的吞下，暂别，或许再也不见，才明白，对你的不仅仅只是喜欢。</p>
<p>两个人在一起，有着相互的陪伴、照顾，收获了友情，和满满的美好的回忆。</p>
<img class="downico" src="./img/down.png" />
</div>
</div>
<div class="section" data-anchor="img1">
<img class="aimg" src="./img/friend.jpeg" />
</div>
<div class="section" data-anchor="content2">
<div class="content">
<p>2016年，我们遇见，初识总是很美好。</p>
<p>君记否，龙儿，你，妃妃，我，后面还有好多人加入我们，组成一个大家族，我们在一起了。</p>
<p>君记否，我玩的少了，你跟我说，你最舍不得人是我，而我，最不舍得的人亦是你!</p>
</div>
</div>
<div class="section" data-anchor="content3">
<div class="content">
<p>君记否，薇薇小产，内心很痛苦，恨自己为什么没有提前多准备一些，多了解一些。如果没有你的倾言宽慰，那段时间一定是一段泥沼。</p>
<p>君记否，人妖当了2年多，如果没有你，我应该早已经弃了。但是舍不得，因为有你的陪伴，割舍不掉。</p>
</div>
</div>
<div class="section" data-anchor="content4">
<div class="content">
<p>每一天的日常，四本十妖，风雨无阻，我们在一起。</p>
<p>每一次的紫薇，要打很多次，每次的地煞，要打很多次，我们还在一起。</p>
<p>有天，我终于跟你说我是男的，那一天，彷徨不安，我怕你会再也不理我，因为我骗了你近两年。</p>
</div>
</div>
<div class="section" data-anchor="img2">
<img class="aimg" src="./img/img1.png" />
</div>
<div class="section" data-anchor="img3">
<img class="aimg" src="./img/img2.png" />
</div>
<div class="section" data-anchor="content5">
<div class="content">
<p>后来你有了固定队。一次星官，让我觉得我失去了你。背叛，充满了我的双眼。我仿佛失去了最重要的部分。</p>
<p>因为我的不成熟，我们终于开始有了争吵，吵到很凶，吵到好友都删掉。</p>
<p>平常的交往无法感知对一个人的感觉，只有失去，才会明白是多么的痛彻心扉。不甘心，不情愿。其实，也是直到这时候，我才真的知道，原来，我已经喜欢你，很久很久了！</p>
<p>我要让自己变的更强，找一个更靠谱的队伍，在所有活动的固定时间等你。现在想想，其实这些你已经为我做了三年了。而我，却一直在傻傻的在享受。</p>
</div>
</div>
<div class="section" data-anchor="img4">
<img class="aimg" src="./img/ddd.png" />
</div>
<div class="section" data-anchor="content6">
<div class="content">
<p>还好，你没有放弃我，你成了我的二傻，我成了你的大傻。</p>
<p>喜欢，有时候真的是非常正能量的感情。我在变，喜欢你，就是让你更好。我开始吧你的朋友当我的朋友。集齐你所有固定队的好友。劝你早睡，劝你看书，甚至还劝你脱坑，用我的方式来感染你。</p>
<p>你知道我买了房，你知道你买了房。你知道变瘦的我，我知道变胖的你，融入彼此生活太多。虽未相见，却已彼此相知相识。</p>
</div>
</div>
<div class="section" data-anchor="img5">
<img class="aimg" src="./img/ff.png" />
</div>
<div class="section" data-anchor="content7">
<div class="content">
<p>我选择和你做朋友，也是希望可以和你同甘共苦，为你分忧解难。</p>
<p>大晚上，唠叨了这么多，可还是要为我们的友谊干杯，谁让你是我朋友呢。</p>
<p>身边的人总是很匆忙，匆匆来，匆匆去，</p>
<p>我们是游戏里朋友，或许暂时分别，但我们还有那些日夜，那些约定，那些相遇。那些说不完的故事，忘不掉!接下来，我会去现实世界中去找你！那时候，我会跟你说：丝丝，我是王宽,也是你的好朋友薇薇!</p>
</div>
</div>
<audio id="music" src="http://img.souche.com/f2e/6717d4ff2a28851b4ec75552e7f8b230.mp3"></audio>
<!-- <audio id="music" src="http://img.souche.com/f2e/6717d4ff2a28851b4ec75552e7f8b230.mp3" loop="loop"></audio> -->
</div>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/3.0.4/fullpage.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="./src/map.js"></script>
<script>
var homePageUrl = 'http://wangkuan90.github.io/';
if (location.href !== homePageUrl) {
location.href = homePageUrl;
}
$(document).ready(function() {
setTimeout(function() {
document.getElementById('music').play();
}, 10000);
window.fl = new fullpage('#fullpage', {
autoScrolling: true,
scrollHorizontally: true,
afterLoad: function(origin) {
var loadedSlide = this;
//第二节的第一张幻灯片
if (!origin) {
fullpage_api.setAllowScrolling(false);
setTimeout(() => {
// 页面自动滚动到第二章
fl.moveSectionDown();
}, 5000);
}
//第二节的第一张幻灯片
if (origin && origin.anchor == 'start') {
initMap();
}
//第二节的第一张幻灯片
if (origin && origin.anchor == 'map') {
fullpage_api.setAllowScrolling(true);
fullpage_api.setAllowScrolling(false, 'up');
}
//离开第二节后
if (origin && origin.index === 1) {
fullpage_api.setAllowScrolling(true);
fullpage_api.setAllowScrolling(false, 'up');
} else if (origin && origin.index >= 2) {
fullpage_api.setAllowScrolling(true, 'up');
}
}
});
});
</script>
</body>
</html>