-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
164 lines (154 loc) · 5.72 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
<!DOCTYPE html>
<html lang="ko">
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-X1JQNTK8K4"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-X1JQNTK8K4');
</script>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover">
<meta name="author" content="Tom Ko & Jun K0">
<meta name="keywords" content="크리스마스에 당신이 볼 영화는?, mbti-test, 영화 테스트">
<meta name="description" content="크리스마스 영화 테스트">
<meta name="naver-site-verification" content="7b1be8cf03d2bf68663ff7b54480c9099b7dc3de" />
<meta property="og:type" content="website">
<meta property="og:title" content="크리스마스, 당신만을 위한 영화 추천">
<meta property="og:description" content="집콕하고 영화보자">
<meta property="og:image" content="http://www.inssatest.com/img/donseok.jpg">
<!-- https://jun-k0.github.io/movie_test/img/donseok.jpg -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>
크리스마스, 당신만을 위한 영화 추천
</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/animation.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/welcome.css">
<link rel="stylesheet" href="css/qna.css">
<link rel="stylesheet" href="css/calc.css">
<link rel="stylesheet" href="css/result.css">
<script src="//developers.kakao.com/sdk/js/kakao.min.js"></script>
</head>
<body>
<div id="wrap">
<section id="welcome" class="container">
<div id="title-box">
<h1 class="main_title">
🎄 나에게 어울리는 🎄
<br>
크리스마스 영화 추천
</h1>
<h3 class="sub_title">
이번 "크리스마스"
<br>
안전하게 집에서 보내셔야죠?
</h3>
</div>
<!--
<div id="name-input">
<input type="text" placeholder="이름" autofocus>
</div>
<p class="check-name warning"></p>
-->
<div class="start-wrap">
<button class="start">테스트 시작하기</button>
</div>
</section>
<section id="qna" class="container">
<div class="status-bar">
<div class="status"></div>
</div>
<div class="q_box"></div>
<div class="q_box2"></div>
<div class="answer">
</div>
</section>
<section id="calc">
<div class="calc-bar">
CALCULATING
<div class="calc"></div>
</div>
<p class="wait">잠시 기다려주세요...</p>
</section>
<section id="result" class="container">
<h3 class="text1" style="font-size:15px">
이번 크리스마스
<br>
당신이 꼭 봐야할 영화는...
</h3>
<div class="text3"></div>
<h1 class="text2">
</h1>
<div id="desc-box">
<div class="art">
</div>
<h3 class="res_title"></h3>
<h3 class="res_title2"></h3>
<ul class="res_desc">
<li class="desc_txt li1"></li>
<li class="desc_txt li2"></li>
<li class="desc_txt li3"></li>
<li class="desc_txt li4"></li>
</ul>
</div>
<div class = "about-match">
<div class="match-box">
<h4 class="match_txt">평생 영화 친구</h3>
<div class="match-img"></div>
</div>
<div class="unmatch-box">
<h4 class="unmatch_txt">영화보다 싸울 친구</h3>
<div class="unmatch-img"></div>
</div>
</div>
<h3 class="share_txt">결과 공유하고 영화친구 찾기</h3>
<div class="share_box">
<a id="kakao-link-btn" href="javascript:sendLink()">
<img src="img/kakaoicon.png"/>
</a>
<div class="btn">
<img src="img/share.png">
</div>
</div>
<div class="more_movie" onclick="location.href='http://bit.ly/34qyhk4';">
영화 더 알아보기
</div>
<div class="restart" onclick="location.href='http://www.inssatest.com/';">
다시 테스트 하기
</div>
</section>
<footer id="footer">
</footer>
</div>
<script src="js/data.js"></script>
<script src="js/main.js"></script>
<script type="text/javascript">
Kakao.init('a2331e4bb576f485ec3ed92b090c34db');
function sendLink() {
Kakao.Link.sendCustom({ templateId: 43046,
templateArgs:{
'img':document.querySelector('.art').getElementsByTagName('img')[0].currentSrc,
'title':
document.querySelector('.text3').innerHTML+' - '+
document.querySelector('.art').getElementsByTagName('img')[0].title
}
})
}
</script>
<script src='https://unpkg.com/magic-snowflakes/dist/snowflakes.min.js'></script>
<script>
var sf = new Snowflakes({
color: "#ffffff", // 색상
count: 75, // 갯수
minOpacity: 0.2, // 최소 투명도 0: 투명 | 1: 불투명
maxOpacity: 0.6 // 최대 투명도
// 출처: https://sweet-myo.tistory.com/497 [달콤한환상]
});
</script>
</body>
</html>