-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
647 lines (568 loc) · 29.2 KB
/
index.html
File metadata and controls
647 lines (568 loc) · 29.2 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
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
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>有我在生物科技 HEREiAM™ Biotech</title>
<link rel="icon" href="images/favicon.png">
<meta http-equiv="pragma" content="no-cache">
<meta name="description" content="凡世．我在 from Earth to Earth．HERE i AM" >
<meta name="author" content="charlie and Wei">
<meta name="og:title" content="HEREiAM™ Biotech">
<meta name="og:description" content="凡世．我在 from Earth to Earth．HERE i AM">
<meta name="og:type" content="website">
<meta property="og:url" content="https://hereiam.one"/>
<meta name="og:image" content="images/ogimg.png">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
<!-- Bootstrap -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
<!-- icon fonts font Awesome -->
<link href="assets/css/font-awesome.min.css" rel="stylesheet">
<!-- Import Magnific Pop Up Styles -->
<link rel="stylesheet" href="assets/css/magnific-popup.css">
<!-- Import YTPlayer Styles -->
<link rel="stylesheet" href="assets/css/jquery.mb.YTPlayer.min.css">
<!-- Import Custom Styles -->
<link href="assets/css/style.css" rel="stylesheet">
<!-- Import Animate Styles -->
<link href="assets/css/animate.min.css" rel="stylesheet">
<!-- Import owl.carousel Styles -->
<link href="assets/css/owl.carousel.css" rel="stylesheet">
<!-- Import Custom Responsive Styles -->
<link href="assets/css/responsive.css" rel="stylesheet">
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body class="header-fixed-top">
<div id="page-top" class="page-top"></div><!-- /.page-top -->
<section id="top-contact" class="top-contact">
<div class="container">
<div class="row">
<div class="col-sm-8 pull-left">
<ul class="contact-list">
<li>
<a class="info" href="mailto:LABotDRs.A@gmail.com">
<span class="top-icon"><i class="fa fa-envelope"></i></span>
LABotDRs.A@gmail.com
</a>
</li>
</ul>
</div>
<div class="col-sm-4 pull-right">
<div class="top-social">
<ul>
<li>
<a href="https://www.messenger.com/t/1774638832803968" target="_blank" class="top-icon fa fa-comments"></a>
</li>
<li>
<a href="https://www.facebook.com/HEREiAM.Biotech" target="_blank" class="top-icon fa fa-facebook"></a>
</li>
<li>
<a href="/en" style="font-weight:800;color:white">中/EN</a>
</li>
</ul>
</div>
</div>
</div><!-- /.row -->
</div><!-- /.container -->
</section><!-- /#top-contact -->
<section id="site-banner" class="site-banner text-center">
<div class="container">
<div class="site-logo">
<img src="images/logo.png" alt="Site Logo">
</div><!-- /.site-logo -->
</div><!-- /.container -->
</section><!-- /#site-banner -->
<header id="main-menu" class="main-menu">
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#menu">
<i class="fa fa-bars"></i>
</button>
<div class="menu-logo">
<a href="./"><img src="images/logo.png" alt="menu Logo"></a>
</div><!-- /.menu-logo -->
</div>
<nav id="menu" class="menu collapse navbar-collapse">
<ul id="headernavigation" class="menu-list nav navbar-nav">
<li class="active"><a href="#page-top">首頁</a></li>
<li><a href="#videos">最新影片</a></li>
<li><a href="#news">最新消息</a></li>
<li><a href="#product">產品介紹</a></li>
<li><a href="#stories">生命延展故事</a></li>
<li><a href="#qa">常見問題</a></li>
<li><a href="#about">關於我們</a></li>
<li><a href="#contact">聯繫我們</a></li>
</ul><!-- /.menu-list -->
</nav><!-- /.menu-list -->
</div>
</div><!-- /.row -->
</div><!-- /.container -->
</header><!-- /#main-menu -->
<section>
<div id="home_video"
class="player"
style="min-height:60vh;"
data-property="{
videoURL:'https://youtu.be/wbtUUJt9CIA',
containment:'#home_video',
autoPlay:true,
mute:true,
startAt:0,
opacity:1,
loop:true,
showControls:false,
showYTLogo: false,
stopMovieOnBlur: false}">
<div id="video_sound" class="video_btn video_btn_mute hover"></div>
</div>
</section><!-- /#main-slider -->
<section id="videos">
<div class="container">
<div class="post-area">
<div class="post-area-top text-center">
<h2 class="post-area-title">最新影片</h2>
<p class="title-description" style="color: #99CC00;">Latest Clips</p>
</div><!-- /.post-area-top -->
<div class="row" style="margin-top: 40px;">
<div class="col-sm-6 video_frame_col">
<iframe class="video_frame" scrolling="no" src="https://www.youtube.com/embed/qic02t6AEW0" frameborder="0" allowfullscreen></iframe>
</div>
<div class="col-sm-6 video_frame_col">
<iframe class="video_frame" scrolling="no" src="https://www.youtube.com/embed/Mh6Xd243tt4" frameborder="0" allowfullscreen></iframe>
</div>
<div class="col-sm-6 video_frame_col">
<iframe class="video_frame" scrolling="no" src="https://www.youtube.com/embed/lTS-UHuBVss" frameborder="0" allowfullscreen></iframe>
</div>
<div class="col-sm-6 video_frame_col">
<iframe class="video_frame" scrolling="no" src="https://www.youtube.com/embed/qbaqDLVLrLQ" frameborder="0" allowfullscreen></iframe>
</div>
<div class="col-sm-6 video_frame_col">
<iframe class="video_frame" scrolling="no" src="https://www.youtube.com/embed/wbtUUJt9CIA" frameborder="0" allowfullscreen></iframe>
</div>
<div class="col-sm-6 video_frame_col">
<iframe class="video_frame" scrolling="no" src="" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</section>
<section id="news">
<div class="container">
<div class="post-area">
<div class="post-area-top text-center">
<h2 class="post-area-title">最新消息</h2>
<p class="title-description" style="color: #99CC00;">Latest News</p>
</div><!-- /.post-area-top -->
<div class="row">
<div class="service-items">
<div class="col-sm-12">
<div class="service-accordion">
<div class="accordion">
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<template v-for="item of newsList">
<div class="panel panel-default">
<div class="panel-heading" role="tab" :id="'news_heading'+item.id">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" :href="'#news_collapseOne_'+item.id" aria-expanded="false" :aria-controls="'#news_collapseOne_'+item.id">
<span>{{item.time}} {{item.title}}</span>
</a>
</h4>
</div>
<div :id="'news_collapseOne_'+item.id" class="panel-collapse collapse" role="tabpanel" :aria-labelledby="'news_heading_'+item.id">
<div class="panel-body">
<p v-html="item.content"></p>
</div>
</div>
</div>
</template>
</div><!-- /.panel-group -->
</div><!-- /.accordion -->
</div><!-- /.service-accordion -->
</div>
</div>
</div>
</div>
</div>
</section> <!-- news -->
<section id="product" class="services">
<div class="container">
<div class="service-area">
<div class="post-area-top text-center">
<h2 class="post-area-title">產品介紹</h2>
<p class="title-description" style="color: #99CC00;">Our Products</p>
</div><!-- /.post-area-top -->
<div class="row">
<div class="service-items">
<div class="col-sm-6">
<p>有我在TM生技服務，經過多年試營運的籌備，於2016年8月隆重上市，有我在TM是智慧的結晶，運用多項諾貝爾獎核心科技，萃煉出基因轉殖的現代工藝，將您的基因完美片段送入另一物種中，量身打造消費者生命的有我在TM基因工程與生命延展服務。</p>
<p>在台灣維持現狀的官方語境裡，「有我在」代表著「有我在，一切都不用擔心，我都一直在這裡」。《有我在》生技服務，超越了造物設計者的生華榮枯，實現了生命瑰麗的延展能量，不僅讓您能夠永遠陪伴您最重要的人，陪伴您自己，更能讓您更了解自己的真實存在。</p>
<p>目前生命延展服務所涵蓋的轉基因生物（Genetic Modified Organism, 簡稱GMO），已經完全進入商業運轉的僅有大腸桿菌、阿拉伯芥、香蕉、文心蘭等四種，接下來將陸續正式推出其他物種。所有技術面上的方法選擇，由本公司依照執行當下的技術發展與公司設備做調整。</p>
<p>我們也提供客製化的服務。如您有特別偏好的方法或技術，需客製化調整或增添服務內容，無論您偏好的序列不是本公司系統設定，或您所偏好的物種不在此列，也歡迎您與產品專員聯繫，我們會就目前技術發展、序列或物種特性、以及本公司的設備與資源等，與您討論是否可行。若技術上可行，即可與您商議一個適宜的價格與詳細服務方式。所有產品諮詢的本身均為免費（不包含教學課程）。目前已經成功的客製化物種包括：蘑菇、藍綠藻、等。</p>
</div>
<div class="col-sm-6">
<div class="service-accordion">
<div class="accordion">
<div class="panel-group" id="product_accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="product_heading_1">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#product_accordion" href="#product_collapse_1" aria-expanded="false" aria-controls="product_collapse_1">
野放許可申請
</a>
</h4>
</div>
<div id="product_collapse_1" class="panel-collapse collapse" role="tabpanel" aria-labelledby="product_heading_1">
<div class="panel-body">
<p>
在基本服務外，如您有田間野放（field release）需求，以滿足想服食轉基因生物（Genetic Modified Organism，簡稱GMO） ，養殖於自家田園農場等願望，我們能協助您準備所需資料，並替您處理繁瑣的申請流程。因為不同物種、轉殖基因、野放規模，所需的程序略有差異，各國法規也不同，意者請洽詢本公司經驗豐富的產品專員，我們將審慎替您評估所需的經費與時間。
</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="product_heading_2">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#product_accordion" href="#product_collapse_2" aria-expanded="false" aria-controls="product_collapse_2">
親手轉殖
</a>
</h4>
</div>
<div id="product_collapse_2" class="panel-collapse collapse" role="tabpanel" aria-labelledby="product_heading_2">
<div class="panel-body">
<p>
您可親至本公司，在技術人員的協助下，親手操作基因轉殖過程。（針對每個生命延展專案，您能有一次免費親手轉殖的機會。）
</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="product_heading_3">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#product_accordion" href="#product_collapse_3" aria-expanded="false" aria-controls="product_collapse_3">
親身繁衍
</a>
</h4>
</div>
<div id="product_collapse_3" class="panel-collapse collapse" role="tabpanel" aria-labelledby="product_heading_3">
<div class="panel-body">
<p>
您可親至本公司，親身參與載有您基因的生命的成長，觀察並協助它們無性或有性的繁殖歷程。（針對每個生命延展專案，每年您能有一次免費參與親身繁衍的機會。）
</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="product_heading_4">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#product_accordion" href="#product_collapse_4" aria-expanded="false" aria-controls="product_collapse_4">
合約期滿
</a>
</h4>
</div>
<div id="product_collapse_4" class="panel-collapse collapse" role="tabpanel" aria-labelledby="product_collapse_4">
<div class="panel-body">
<p>
我們會於合約期滿前的一年、半年、三個月、一個月前，共四次通知您銷毀日期與時間，您可選擇續約，如於銷毀日期前一週均無主動聯繫本公司，我們將在合約結束時，以高壓蒸氣滅菌斧，在2個大氣壓力、攝氏121度、30分鐘的標準情境下銷毀後丟棄。您也可主動聯繫本公司，要求參與銷毀過程，並將銷毀後的殘骸帶回家中保存與丟棄。
</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="product_heading_5">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#product_accordion" href="#product_collapse_5" aria-expanded="false" aria-controls="product_collapse_5">
海外委託
</a>
</h4>
</div>
<div id="product_collapse_5" class="panel-collapse collapse" role="tabpanel" aria-labelledby="product_collapse_5">
<div class="panel-body">
<p>
本服務接受遠距委託，地點包括海外，但需附加運費（隨快遞公司價格調整）、樣品收集器材寄送盒裝包材費、以及遠距服務的行政處理費。
</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="product_heading_6">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#product_accordion" href="#product_collapse_6" aria-expanded="false" aria-controls="product_collapse_6">
教學課程
</a>
</h4>
</div>
<div id="product_collapse_6" class="panel-collapse collapse" role="tabpanel" aria-labelledby="product_heading_6">
<div class="panel-body">
<p>
針對您所選擇的服務內容，我們會提供基本的技術指導與原理說明，讓您更了解這項服務的精神與意涵。除此之外，為了回饋社會，我們也會不時錄製教學影片和文件放置網路上與公眾免費分享，您可自由觀看，探索服務背後隱含的科學與科技。
</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="product_heading_7">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#product_accordion" href="#product_collapse_7" aria-expanded="false" aria-controls="product_collapse_7">
預約探視
</a>
</h4>
</div>
<div id="product_collapse_7" class="panel-collapse collapse" role="tabpanel" aria-labelledby="product_heading_7">
<div class="panel-body">
<p>
您可隨時親至本公司探視您基因的載體，但建議您於至少兩周前預約，以利作業與排程。尤其是清明節前後業務特別繁忙，未免遺憾，請即早預約。
</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="product_heading_8">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#product_accordion" href="#product_collapse_8" aria-expanded="false" aria-controls="product_collapse_8">
核心技術
</a>
</h4>
</div>
<div id="product_collapse_8" class="panel-collapse collapse" role="tabpanel" aria-labelledby="product_heading_8">
<div class="panel-body">
<ul>
<li style="display:list-item;">基因轉殖技術: 熱衝擊，電穿孔，粒子轟擊、農桿菌、CRISPR</li>
<li style="display:list-item;">篩選標記基因：Amp , Basta, or NPTII抗性</li>
<li style="display:list-item;">報導基因：藍白篩選、螢光基因（GFP等</li>
<li style="display:list-item;">序列確認：桑格定序法</li>
</ul>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="product_heading_9">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" data-parent="#product_accordion" href="#product_collapse_9" aria-expanded="false" aria-controls="product_collapse_9">
空間設施
</a>
</h4>
</div>
<div id="product_collapse_9" class="panel-collapse collapse" role="tabpanel" aria-labelledby="product_heading_9">
<div class="panel-body">
<ul>
<li style="display:list-item;">人工氣候室：控溫、控濕、控光</li>
<li style="display:list-item;">冷藏：4度C，-20度C，-80度C</li>
<li style="display:list-item;">乾燥箱：種子保存</li>
<li style="display:list-item;">24小時線上直播監控系統</li>
</ul>
</div>
</div>
</div>
</div>
</div><!-- /.accordion -->
</div><!-- /.service-accordion -->
</div>
<div class="col-sm-12">
<h3 style="margin-top: 30px; margin-bottom: 30px;">服務流程</h3>
<div class="txt_img txt_img_L"><img src="images/product_1.png"></div>
<h3 style="margin-top: 30px; margin-bottom: 30px;">生命延展服務</h3>
<p>以下估算價格，僅涵蓋生命延展的基本服務項目，包括收集客戶檢體，委託基因轉殖、GMO委託保存、繁衍與養殖。從第11年起，價格隨物價浮動。有您基因的GMO，如無特別要求，原則上均將在本公司保存至少一線（LINE），直至合約結束。</p>
<div class="txt_img txt_img_L" style="margin-top:20px;margin-bottom: 30px;"><img src="images/product_2.png"></div>
</div>
</div><!-- /.service-items -->
</div><!-- /.row -->
</div><!-- /.service-area -->
</div><!-- /.container -->
</section><!-- /#services -->
<section id="stories" class="latest-post">
<div class="container">
<div class="post-area">
<div class="post-area-top text-center">
<h2 class="post-area-title">《有我在》真實生命延展故事</h2>
<p class="title-description">HEREiAM Real Life Expansion Stories</p>
</div><!-- /.post-area-top -->
<div class="row">
<div class="latest-posts">
<!-- 一篇開始 -->
<template v-for="story of stories">
<div class="col-sm-6">
<div class="item">
<article class="post type-post">
<div class="post-content">
<h2 class="entry-title">
{{story.title}}
</h2>
<template v-for="p of story.content">
<p class="entry-text" v-html="p"></p>
</template>
</div><!-- /.post-content -->
</article>
</div><!-- /.item -->
</div>
</template>
<!-- 一篇結束 -->
</div><!-- /.latest-posts -->
</div><!-- /.row -->
</div><!-- /.post-area -->
</div><!-- /.container -->
</section><!-- /#latest-post -->
<section id="qa">
<div class="container">
<div class="post-area">
<div class="post-area-top text-center">
<h2 class="post-area-title">常見問題</h2>
<p class="title-description" style="color: #99CC00;">FAQ</p>
</div><!-- /.post-area-top -->
<h5>Q：這個X爾康公司的生命延續服務有甚麼不一樣？</h5>
<p class="txt_padding">A：該公司所提供的生命延續服務是將人體低溫長期凍存，與本公司所提供的跨物種基因轉殖服務完全不同。</p>
<h5>Q：這跟複製人有甚麼不一樣？</h5>
<p class="txt_padding">A：目前市面上並沒有任何公司或實驗室擁有複製人類的技術。本公司所有的核心技術，都是引用已經發展成熟的技術，在提供服務之前，我們就會評估可行性與技術的穩定性。我們所做的，是將您的基因轉殖到另一（非動物的）物種並進行繁衍，與複製人的技術並不相似。</p>
<h5>Q：我的基因放到其他的生命之後，會對它們產生甚麼影響嗎？</h5>
<p class="txt_padding">A：本公司將不會將您的基因在其他物種中表現。也就是說，其他物種將僅承載您的基因片段，除此之外，您的基因片段將不會對該物種有任何其他影響。這是成功率最高、也對環境最友善的作法。</p>
<h5>Q：可否有多餘一段的基因放到其他物種中嗎？</h5>
<p class="txt_padding">A：當然可以，若您有興趣，請洽本公司的產品專員。</p>
<h5>Q：可以放到另一個人裡面嗎？</h5>
<p class="txt_padding">A：因為人體實驗的爭議性與危險性，以及目前技術的侷限，本公司並不提供此服務。</p>
</div>
</div>
</section>
<section id="about">
<div class="container">
<div class="post-area">
<div class="post-area-top text-center">
<h2 class="post-area-title">關於我們</h2>
<p class="title-description" style="color: #99CC00;">About Us</p>
</div><!-- /.post-area-top -->
<p>西元2009年，幾個各具專長的好朋友聚在一起，想讓科學理性求真之外，更進一步的，為人類做點什麼。經過密集的討論與準備，2011年《有我在》計畫開始運作，經過五年的試營運，我們的服務不斷的改進與修正，《有我在® 生物科技股份有限公司》，正式成立於西元2016年8月，期待能提供最貼心的生命延展服務，陪伴每一個使用者的生命需求。</p>
</div>
</div>
</section>
<footer id="contact">
<div class="footer-top">
<div class="text-center" style="margin-bottom: 40px; letter-spacing: 0.3rem;">
<h3>聯繫我們</h3>
</div>
<div class="container">
<div class="row">
<div id="tweet" class="tweet text-center">
<div class="col-xs-12 about-tweet">
<p>如果對我們公司或產品有任何疑問或意見，請至<a href="https://www.facebook.com/HEREiAM.Biotech" style="text-decoration: underline">《有我在》臉書專頁</a>留言，我們親切的專員將會盡速替您服務喔！</p>
<p>If you have any questions or comments regarding our company or products, please leave a message on our <a href="https://www.facebook.com/HEREiAM.Biotech" style="text-decoration: underline">Facebook Page</a>.</br> Our friendly specialists will respond to you shortly!</p>
</div>
</div><!-- /#tweet -->
</div><!-- /.row -->
</div><!-- /.container -->
</div><!-- /#footer-top -->
<div id="footer-bottom" class="footer-bottom text-center">
<div class="container">
<div id="copyright" class="copyright">
© 有我在生物科技 HEREiAM™ Biotech 2018 - Webpage Design by <a href="https://www.facebook.com/charlie.chang.758" style="text-decoration: underline">Charlie</a> & Wei with ♥
</div><!-- /#copyright -->
</div>
</div><!-- /#footer-bottom -->
</footer>
<div id="scroll-to-top" class="scroll-to-top">
<span>
<i class="fa fa-chevron-up"></i>
</span>
</div><!-- /#scroll-to-top -->
<!-- Include jquery.min.js plugin -->
<script src="assets/js/jquery-2.1.0.min.js"></script>
<!-- Include YTPlayer.js plugin -->
<script src="assets/js/jquery.mb.YTPlayer.min.js"></script>
<!-- Javascript Plugins -->
<script src="assets/js/plugins.js"></script>
<!-- Custom Functions -->
<script src="assets/js/functions.js"></script>
<!-- VueJs -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<!-- axios -->
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
var vNews = new Vue({
el: '#news',
created: function () {
// `this` points to the vm instance
this.geData();
},
data: {
loading: true,
newsList: []
},
methods: {
geData() {
axios({
method: 'get',
url: '/data/news_tw.json',
})
.then((response) => {
this.newsList = response.data.news;
console.log('newsList :',this.newsList);
this.loading = false;
})
.catch((error) => {
console.error(error)
});
},
}
})
var vStory = new Vue({
el: '#stories',
created: function () {
// `this` points to the vm instance
this.geData();
},
data: {
loading: true,
stories: []
},
methods: {
geData() {
axios({
method: 'get',
url: '/data/story_tw.json',
})
.then((response) => {
this.stories = response.data.stories;
console.log('stories :',this.stories);
this.loading = false;
})
.catch((error) => {
console.error(error)
});
},
}
})
</script>
<script>
$(document).ready(function() {
/* -------- One page Navigation ----------*/
$('#main-menu #menu').onePageNav({
currentClass: 'active',
changeHash: false,
scrollSpeed: 1500,
scrollThreshold: 0.5,
scrollOffset: 95,
filter: ':not(.sub-menu a, .not-in-home)',
easing: 'swing'
});
$("#home_video").YTPlayer();
var state_sound = false;
$("#video_sound").click(function(){
if(!state_sound)
{
$('#home_video').YTPUnmute();
state_sound = true;
$( ".video_btn" ).removeClass( "video_btn_mute" ).addClass( "video_btn_unmute" );
}
else
{
$('#home_video').YTPMute();
state_sound = false;
$( ".video_btn" ).removeClass( "video_btn_unmute" ).addClass( "video_btn_mute" );
}
});
});
</script>
</body>
</html>