-
Notifications
You must be signed in to change notification settings - Fork 2
Expand file tree
/
Copy pathindex.html
More file actions
213 lines (190 loc) · 7.88 KB
/
index.html
File metadata and controls
213 lines (190 loc) · 7.88 KB
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
<!DOCTYPE html>
<html>
<!--タイトル-->
<head>
<meta charset="UTF-8">
<meta name=”robots” content=”noindex”>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>中央大学 iTLFest.</title>
<link rel="stylesheet" href="css/style.css">
<link rel="icon" href="/favicon.ico" id="favicon">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png">
<link href="css/lightbox.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="js/loading.js"></script>
<script src="js/lightbox.js"></script>
</head>
<!--本文-->
<!--ヘッダー情報-->
<body>
<div id="loadingScreen" class="loading-screen">
<img src="img/logo_loading.gif" alt="Loading...">
</div>
<div class="wrapper">
<main>
<header class="header">
<img class="logo" src="img/fest_logo_2024.png">
<p>2024年度は11月2日,11月3日の2日間に渡り、中央大学市ヶ谷田町キャンパスで開催!!!</p>
<nav class="nav">
<ul>
<li><a href="index.html">ホーム</a></li>
<li><a href="about.html">概要</a></li>
<li><a href="program.html">企画紹介</a></li>
<li><a href="access.html">アクセス</a></li>
<li><a href="contact.html">お問い合わせ</a></li>
<li><a href="https://twitter.com/festival_itl" target="_blank"><img src="img/x_logo.png" width="20" height="20"></a></li>
<li><a href="https://www.instagram.com/itlfest_2024/?hl=ja" target="_blank"><img src="img/instagram_logo.png" width="20" height="20" alt="Instagram"></a></li>
</ul>
</nav>
</header>
<div class="wrapper">
<h1 class="heading">iTLFest.2024開催から</h1>
<div class="timer">
<div class="sub_timer">
<h2 id="day" class="digit">00</h2>
<p class="digit_name">Days</p>
</div>
<div class="sub_timer">
<h2 id="hour" class="digit">00</h2>
<p class="digit_name">Hours</p>
</div>
<div class="sub_timer">
<h2 id="min" class="digit">00</h2>
<p class="digit_name">Minutes</p>
</div>
<div class="sub_timer">
<h2 id="sec" class="digit">00</h2>
<p class="digit_name">Seconds</p>
</div>
</div>
<script>
var target_mili_sec = new Date("Nov 2, 2024 10:00:0").getTime();
function timer() {
var now_mili_sec = new Date().getTime();
var elapsed_sec = Math.floor((now_mili_sec - target_mili_sec) / 1000);
var day = Math.floor(elapsed_sec / (3600 * 24));
var hour = Math.floor((elapsed_sec % (3600 * 24)) / 3600);
var min = Math.floor((elapsed_sec % 3600) / 60);
var sec = Math.floor(elapsed_sec % 60);
document.querySelector("#day").innerHTML = day < 0 ? 0 : day;
document.querySelector("#hour").innerHTML = hour < 0 ? 0 : hour;
document.querySelector("#min").innerHTML = min < 0 ? 0 : min;
document.querySelector("#sec").innerHTML = sec < 0 ? 0 : sec;
}
setInterval(timer, 1000);
</script>
<style>
.timer {
width: 100%;
display: flex;
justify-content: space-between;
margin-top: 30px;
}
.sub_timer {
width: 220px;
background: rgba(255, 255, 255, 0.19);
backdrop-filter: blur(20px);
border-radius: 20px;
overflow: hidden;
}
.digit {
color: #fff;
font-weight: lighter;
font-size: 70px;
text-align: center;
padding-top: 2rem;
margin: 0%;
border: none;
}
.digit_name {
color: #000;
background: #fff;
text-align: center;
padding: 0.6rem 0;
font-size: 20px;
}
</style>
</div>
<h2>お知らせ</h2>
<div class="large honbun">
<table>
<tr>
<td>2023年11月03日</td>
<td>iTLFest.2024これにて閉幕しました!<br>
ご協力頂いたすべての皆様ありがとうございました。</td>
</tr>
<tr>
<td>2024年11月02日</td>
<td>iTLFest.2024開幕です！</td>
</tr>
<tr>
<td>2024年10月30日</td>
<td>今年度の<a href="iTLFest.2024パンフレット外部配布用.pdf">パンフレット</a>を公開しました。</td>
</tr>
<tr>
<td>2024年10月24日</td>
<td><a href="program.html">企画紹介</a>ページを公開しました。</td>
</tr>
<tr>
<td>2024年10月02日</td>
<td>今年度の<a data-lightbox="popup" href="img/poster_2024.png">ポスター</a>が完成しました。</td>
</tr>
<tr>
<td>2024年06月19日</td>
<td>iTLFest.2024の開催が決定しました！！</td>
</tr>
</table>
</div>
<h2>SNS</h2>
<p>X(旧twitter)</p>
<!--Twitter貼り付け-->
<blockquote class="twitter-tweet"><a class="twitter-timeline" data-lang="ja" data-width="400" data-height="500"
data-dnt="true" data-theme="dark" href="https://twitter.com/Festival_iTL?ref_src=twsrc%5Etfw">Tweets by
Festival_iTL</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</blockquote>
<br>
</main>
<!--フッター情報-->
<footer class="footer">
<div class="foot-wrap">
<div class="menu-left">
<h3>お役立ち</h3>
<ul class="foot-left">
<li><a class="hover-ul" href="SNS.html">外部リンク集</a></li>
<li><a class="hover-ul" href="iTLFest.2024パンフレット外部配布用.pdf">デジタルパンフレット</a></li>
<li><a class="hover-ul" href="#">Comming soon</a></li>
</ul>
</div>
<div class="menu-center">
<h3>リンク</h3>
<ul class="foot-center">
<li><a class="hover-ul" href="access.html">アクセス</a></li>
<li><a class="hover-ul" href="question.html">よくある質問</a></li>
<li><a class="hover-ul" href="2023/index.html">過年度情報</a></li>
</ul>
</div>
<div class="menu-right">
<h3><a class="hover-ul" href="campuses.html">他キャンパスリンク</a></h3>
<ul class="foot-right">
<li><a class="hover-ul" href="https://hakumonsai.com/">白門祭(多摩)</a></li>
<li><a class="hover-ul" href="https://rikohaku.com/">理工白門祭(後楽園)</a></li>
<li><a class="hover-ul" href="https://www.hakumon-myougadani.com/">白門祭in茗荷谷(茗荷谷)</a></li>
</ul>
</div>
<p>
<ul class="footer-logo">
<li><a href="https://twitter.com/festival_itl" target="_blank"><img src="img/x_logo.png" width="50"
height="50"></a></li>
<li><a href="https://www.instagram.com/itlfest_2024/?hl=ja" target="_blank"><img src="img/instagram_logo.png"
width="50" height="50" alt="Instagram"></a></li>
</ul>
</p>
<!--コピーライト いじらない-->
<p>©iTLFest.実行委員会 All rights reserved.</p>
</div>
</footer>
</div>
</div>
</body>
</html>