-
Notifications
You must be signed in to change notification settings - Fork 0
/
Behind_You_Board.html
163 lines (158 loc) · 7.75 KB
/
Behind_You_Board.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://use.fontawesome.com/releases/v5.2.0/js/all.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.22.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.22.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.22.0/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.22.0/firebase-database.js"></script>
<script src="firebases/init.js"></script>
<script src="main.js"></script>
<script type="text/javascript" src="OpenSide.js"></script>
<title>Behind You Board</title>
<link rel="stylesheet" media="(min-width:768px)" href="computer_Board.css"/>
<link rel="stylesheet" media="(min-width:480px) and (max-width:768px)" href="tablet_Board.css"/>
<link rel="stylesheet" media="(max-width:480px)" href="phone_Board.css"/>
</head>
<body onmousemove="checkLogin()">
<header onclick="playVideo()">
<span id="Menu_Button" onclick="openNav()">=</span>
<p><a href="https://4444.kmuwink.com/">BEHIND YOU</a></p>
<div id="Login_Button" onclick="openAside()"><i class="fas fa-sign-in-alt"></i></div>
</header>
<div id="nav_main_aside">
<nav id = "Board_List">
<div>
<p class="hand">Scared Story</p>
<ul>
<li><a href="https://20171609.github.io/kimhyunmin-chrome-start-page/Behind_You_List.html" class="menu">도시 괴담</a></li>
<li><a href="https://20171609.github.io/kimhyunmin-chrome-start-page/Behind_You_List.html" class="menu">인터넷 괴담</a></li>
<li><a href="https://20171609.github.io/kimhyunmin-chrome-start-page/Behind_You_List.html" class="menu">귀신 이야기</a></li>
<li><a href="https://20171609.github.io/kimhyunmin-chrome-start-page/Behind_You_List.html" class="menu">요괴 이야기</a></li>
</ul>
</div>
<span id = "Nav_Close" onclick="closeNav()">X</span>
<div id = "nav_second">
<p class="hand">BOARD Anithing</p>
<ul>
<li><a href="https://20171609.github.io/kimhyunmin-chrome-start-page/Behind_You_List.html" class="menu">자유 게시판</a></li>
<li><a href="https://20171609.github.io/kimhyunmin-chrome-start-page/Behind_You_List.html" class="menu">괴담 게시판</a></li>
<li><a href="https://20171609.github.io/kimhyunmin-chrome-start-page/Behind_You_List.html" class="menu">이야기 후기</a></li>
<li><a href="https://20171609.github.io/kimhyunmin-chrome-start-page/Behind_You_List.html" class="menu">?????????</a></li>
</ul>
</div>
</nav>
<main onclick="playVideo()">
<div>귀신에 대한 여러가지 정보.</div>
<hr>
<section>
<p id="story">
<strong>귀신은 구석진 곳을 좋아한다고 한다</strong>
<br><br>
- 그래서 책상아래나 옷장위 같은곳에 귀신이 있을 확률이 높다.
<br><br><br><br>
<strong>귀신은 사람형체를 띄고 있다.</strong>
<br><br>
- 길가다가 사람의 형체를 본거같아 돌아보면 어떤 사물이였던적이 있는가?
그런경우는 귀신이 장난치는 것이라고 한다.
<br><br><br><br>
<strong>귀신은 일정하게 반복되는 소리를 좋아한다.</strong>
<br><br>
- 시계가 집에 있을때 째깍째깍 소리가 안들린적이 있지 않은가?
들리지 않는다면 그때는 귀신이 시계에 씌여있다고 한다.
<br><br><br><br>
<strong>귀신얘기를 하면 귀신이 온다고한다.</strong>
<br><br>
- 만약 이글을 보고있다면 당신 뒤에 있을수도..?
나도 이글을 쓰는동안 물건이 계속 떨어졌다. 무섭다 그만쓸래
</p>
</section>
<div id="watch_out">Watch out!</div>
</main>
<aside id="Login_Form">
<div id="login">
<span id = "Aside_Close" onclick="closeAside()">X</span>
<p class="noComputer">Login</p>
<div id="SignInForm">
<form>
<label>ID <input id="ID" type="text" value=""></label>
<label>PW <input id="PW" type="password" value=""></label>
</form>
<button id="sign_in" onclick="remainSignIn()">LogIn</button>
</div>
<div id="forgot">
<a href="" >아이디 찾기</a>
<a href="" >비밀번호 찾기</a>
</div>
<div id="SignedForm">
<p id="hello"><a href="https://4444.kmuwink.com/Add_Board.html">안녕!</a></p>
</div>
<div id="SignOut">
<button onclick="signOut()">로그아웃</button>
</div>
<div id="sign_up">
<a href="https://4444.kmuwink.com/Sign_Up">회원가입</a>
</div>
<div id="search_Box">
<div id="icon"><i class="fas fa-search"></i></div>
<input id="search" type="text" value="">
</div>
</div>
<div id="advertise">
<a href="https://tanger2ne.kmuwink.com/" target="_blank">
<img src="image/song.jpg" class="adimg">
</a>
<a href="https://jjutopia.kmuwink.com/" target="_blank">
<img src="image/zzootopia.png" class="adimg">
</a>
<a href="https://wwjdtm.kmuwink.com/" target="_blank">
<img src="image/milk.jpg" class="adimg">
</a>
</div>
</aside>
</div>
<footer onclick="stopVideo()">
<div>copyright by HYUNMIN</div>
<div id="player"></div>
</footer>
<script>
// 2. This code loads the IFrame Player API code asynchronously.
let tag = document.createElement('script');
tag.src = 'https://www.youtube.com/iframe_api';
let firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
let player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
videoId: 'h1Hb9yElwX4',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange,
}
});
}
function onPlayerReady(event) {
event.target.setVolume(7);
event.target.playVideo();
}
// 5. The API calls this function when the player's state changes.
// The function indicates that when playing a video (state=1),
// the player should play for six seconds and then stop.
var done = false;
function onPlayerStateChange(event) {
if (event.data === YT.PlayerState.PLAYING && !done) {
setTimeout(stopVideo, 6000000);
done = true;
}
}
function playVideo(){
player.playVideo();
}
function stopVideo() {
player.stopVideo();
}
</script>
</body>
</html>