-
Notifications
You must be signed in to change notification settings - Fork 3
/
index.html
248 lines (243 loc) · 13.4 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
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
<!doctype html>
<html>
<head>
<!-- Metas -->
<meta charset="utf-8">
<title>元智大學 | ITAC</title>
<!-- Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1, user-scalable=no" />
<meta name="author" content="KaiYi.C">
<meta name="description" content="元智大學 ITAC 官方網站，歡迎大家的加入！">
<meta name="keywords" content="元智大學, 元智, ITAC, 社團, 資訊研究社" />
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="format-detection" content="telephone=no">
<!-- Favicon -->
<link rel="apple-touch-icon" sizes="57x57" href="assets/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="assets/favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="assets/favicon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="assets/favicon/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="assets/favicon/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="assets/favicon/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="assets/favicon/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="assets/favicon/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="assets/favicon/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="assets/favicon/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="assets/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="assets/favicon/favicon-96x96.png" >
<link rel="icon" type="image/png" sizes="16x16" href="assets/favicon/favicon-16x16.png">
<link rel="manifest" href="assets/favicon/manifest.json">
<meta name="msapplication-TileColor" content="#DB2828">
<meta name="msapplication-TileImage" content="assets/favicon/ms-icon-144x144.png">
<meta name="theme-color" content="#DB2828">
<!-- CSSs -->
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2/semantic.min.css'>
<link rel="stylesheet" href="https://fonts.googleapis.com/earlyaccess/notosanstc.css">
<link rel="stylesheet" href="assets/css/desktop.css">
<link rel="stylesheet" href="assets/css/style.css">
<link rel="stylesheet" href="assets/css/timeline.css">
<!-- Scripts -->
<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');ga('create', 'UA-80552556-1', 'auto');ga('send', 'pageview');</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2/semantic.min.js"></script>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<!-- loader -->
<load class="ui active dimmer">
<load class="ui loader huge indeterminate"></load>
</load>
<!-- Sidebar -->
<snav class="ui right vertical sidebar labeled icon menu inverted overlay" style="z-index: 999">
<a class="item">
<i><img src="assets/img/icon-red.png" style="height: 40px; weight: 40px;"></i><br /> ITAC </a>
<a class="item red" data-scroll-nav="1">
<i class="home icon"></i>首頁</a>
<a class="item red" data-scroll-nav="2">
<i class="info icon"></i>關於 ITAC</a>
<a class="item red" data-scroll-nav="3">
<i class="idea icon"></i>社團活動介紹</a>
<a class="item red" data-scroll-nav="4">
<i class="calendar icon"></i>時程表</a>
<a class="ui item red" data-scroll-nav="5">
<i class="mail icon"></i>我要報名</a>
</snav>
<div class="pusher">
<!-- Navbar -->
<nav class="navbar act1">
<div class="ui secondary menu huge container">
<a class="item" data-scroll-nav="1"><img src="assets/img/icon-red.png" style="height: 40px; weight: 40px; margin: 0; padding: 0;"></a>
<a class="item mobile" style="margin-left: -0.8rem;">元智大學資研社 (ITAC)</a>
<a class="item red desktop" data-scroll-nav="2">關於 ITAC</a>
<a class="item red desktop" data-scroll-nav="3">社團活動介紹</a>
<a class="item red desktop" data-scroll-nav="4">時程表</a>
<div class="right menu">
<a class="ui item red desktop" data-scroll-nav="5">我要報名</a>
<a class="ui item mobile" style="margin-left: -1rem;" onclick="$('.ui.labeled.icon.sidebar').sidebar('toggle');">
<i class="content icon large"></i></a>
</div>
</div>
</nav>
<!-- Section1 -->
<section class="section1" data-scroll-index="1">
<content class="section1-content">
<br />
<img src="assets/img/icon.png" class="img-icon"><br /><br />
<img src="assets/img/itac.png" class="img-itac"><br /><br /><br /><br />
<!--slogan最多14字-->
<strong style="color: rgba(255,254,255,0.9); font-size: 160%;">你 也是資訊狂熱者嗎？</strong><br /><br /><br />
<a style="color: hsl(0, 0%, 90%);" href="#"><i class="dropdown icon huge sec1Dropdown" data-scroll-goto="2"></i></a>
</content>
</section>
<!-- Section2 -->
<section data-scroll-index="2" class="section2">
<content class="ui container secContent">
<h1>關於 ITAC</h1>
<p>
ITAC 創立的初衷 — 「有些事現在不做，一輩子都不會做」。<br />
2014 年的暑假尾聲，正當其他同學們在各地玩得不亦樂乎時，一群熱愛資訊的元智人默默開始聚集，
秉持著「為什麼元智沒有資訊社？」、「那就創一個吧？」的想法，創立了元智第一個資訊性社團 — ITAC。
</p>
<p>
ITAC 全名為 Information Technology Association Club，是由一群熱愛程式的元智學生創立的社團。<br />
ITAC 現階段的成員橫跨大一到大四，成員擅長領域包括 Android、iOS App 開發，
HTML、CSS、JavaScript、PHP 網站設計，
MySQL 資料庫管理，Python，資訊安全等等，
更有多位成員早已在業界工作或是代表學校參加比賽，成員們也期望未來能夠分享給喜歡資訊的同學們。
</p>
<p>
如果對於寫程式只為應付作業的生活感到厭倦，或是想嘗試課外之餘接案賺取零用的同學，給自己一個機會，
一起學習「學校不教的事」，讓自己擁有更多能力去改變自己、改變世界。
</p>
</content>
</section>
<!-- Section3 -->
<section class="section3" data-scroll-index="3">
<content class="ui container secContent section3">
<h1>社團活動介紹</h1>
<p>
我們在上學年前期開設了許多基礎課程，如：R 語言之大數據資料分析、Sass 網頁前端設計、Python 小爬蟲、
Git 版本控制新手村、Android 基礎 App 開發......等等。<br />
擁有基本技能後，大家依照興趣分組完成「Android App 設計」、「網頁前後端製作」等專題，
更有社團的學長姐組成了 hey YZU 開發團隊，
製作 Android / iOS 雙版本的元智 Portal App，而且最近正在招募新人進入團隊呢！<br />
除了基礎課程、專案製作，ITAC 定期也會揪團參加各式社群活動，如：SITCON、COSCUP、HITCON，
帶領社員與國內外同樣熱衷資訊技術的人們交流，增廣見聞、看看其他人都在做些什麼，也多認識領域中的其他強者。<br />
</p><br />
<p>
在這個新學期，ITAC 要招募與我們有共同目標的新血。
</p>
<p>
下學期開始，我們非常榮幸地邀請到業界著名的 TonyQ 作為我們的社團指導老師，
我們將會舉辦演講、開設新手教學課程，當然少不了專案製作，也會舉辦社遊，增進學員間的感情。
由於學員們的課表不一，可能將在之後重新調整社課時間。
</p>
<p>
想要尋找程式路上的夥伴嗎？<br />
想在高手雲集的地方和大家一起切磋技術、交流進步嗎？<br />
想跨出你遲遲不敢跨出的第一步嗎？<br />
想和大家一起打怪練功嗎？<br />
無論你是新手、老手，想要專攻什麼樣的領域，歡迎正式加入 ITAC。
</p>
</content>
</section>
<!-- Section4 -->
<section class="section4" style="height: 1700px;" data-scroll-index="4">
<content class="ui container secContent">
<h1>時程表</h1>
<div class="timelineContainer" id="timeline">
<!-- Timeline - Block1 -->
<div class="timelineBlock">
<div class="timelineImg" style="background-color: rgb(0, 28, 49);">
<img src="assets/img/yzu2016camp.png" style=" width: 42px; height: 42px; margin-left: -21px; margin-top: -21px;">
</div>
<div class="timelineContent">
<h2>2016 三資迎新</h2>
<p>想不想為你大學四年立下一個無與倫比的起點呢？來參加我們的三資迎新吧！</p>
<a href="https://yzu2016camp.itaclub.asia" class="timelineReadmore" style="background: rgba(0, 28, 49, 0.95);">官方網站</a>
<span class="timelineDate">8/22 - 8/26</span>
</div>
</div>
<!-- Timeline - Block2 -->
<div class="timelineBlock">
<div class="timelineImg" style="background: white;">
<img src="assets/img/school.png" style="border-radius: 26px; -webkit-border-radius: 26px; -moz-border-radius: 26px;">
</div>
<div class="timelineContent">
<h2>開學前...</h2>
<p>
<b>8/27 - 8/29 </b>新生入住<br />
<b>8/29 </b>新生健檢<br />
<b>8/30 - 9/7 </b>可以抵學分的英語營唷^^<br />
</p>
<a href="http://www.yzu.edu.tw/admin/aa/files/Calendar/105校曆 104-15行政會議通過版(公告版).doc" class="timelineReadmore" style="background: rgba(0, 0, 153, 0.95);">105行事曆</a>
<span class="timelineDate">8/27 - 9/7</span>
</div>
</div>
<!-- Timeline - Block3 -->
<div class="timelineBlock">
<div class="timelineImg" style="background-color: #fff;">
<img src="assets/img/location.png" style="border-radius: 26px; -webkit-border-radius: 26px; -moz-border-radius: 26px;">
</div>
<div class="timelineContent">
<h2>萬國博覽會</h2>
<p>
新生入學輔導(9/8-9/9)的第一天下午，會有社團博覽會<br />
ITAC 在當天也會在操場擺攤，有介紹也有小教學<br />
歡迎大家來玩個小遊戲，順便來認識我們唷~
</p>
<span class="timelineDate">9/8</span>
</div>
</div>
<!-- Timeline - Block4 -->
<div class="timelineBlock">
<div class="timelineImg" style="background-color: #fff">
<img src="assets/img/event.png" style="border-radius: 26px; -webkit-border-radius: 26px; -moz-border-radius: 26px;">
</div>
<div class="timelineContent">
<h2>社團招募大會</h2>
<p>
在這天晚上，我們會舉辦一個小面試，聊聊大家想進來的原因<br />
屆時會在 <a href="https://fb.com/yzuitac">Facebook</a> 粉專公布面試地點和時間<br />
</p>
<a href="http://itac.kktix.cc/itac-recruit2016" class="timelineReadmore" style="background: #75ce66;">KKTIX報名頁(9/13開放)</a>
<span class="timelineDate">9/27</span>
</div>
</div>
<!-- Timeline - Block5 -->
<div class="timelineBlock">
<div class="timelineImg" style="background-color: rgb(254, 24, 0)">
<img src="assets/img/icon.png">
</div>
<div class="timelineContent">
<h2>第一堂社課</h2>
<p>
第一堂社課會請大家上台說說對社團的期望<br />
順便讓大家認識優秀的你<br />
之後暫定每週二就是我們的社課天囉~~
</p>
<span class="timelineDate">10/4</span>
</div>
</div>
</div>
</content>
</section>
<!-- Section5 -->
<section class="section5" data-scroll-index="5">
<content>
<a href="http://itac.kktix.cc/itac-recruit2016">
<button class="red ui inverted massive button">立即報名(9/13開放)</button></a>
</content>
</section>
</div>
<!-- Scripts -->
<script src="assets/js/scrollIt.min.js"></script>
<script src="assets/js/parallax.min.js"></script>
<script src="assets/js/main.js"></script>
<script src="assets/js/timeline.js"></script>
<script src="assets/js/desktop.js"></script>
</body>
</html>