-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex_front.html
668 lines (635 loc) · 31.2 KB
/
index_front.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
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
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link href="/templates/lacoste/favicon.ico" rel="shortcut icon" type="image/vnd.microsoft.icon">
<title>Lacoste LT12 Lookbook</title>
<link rel="stylesheet" href="css/css_front.css?v=20150529">
<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
</head>
<body>
<!-- Menu -->
<button class="menu-button"><span>Menu</span></button>
<aside class="menu">
<h2><a href="javascript:;">LACOSTE LOOKBOOK</a></h2>
<nav>
<ul>
<li><a target="_blank" class="red" href="http://lt12.cn">LT12互动界面</a>
</li>
<li><a target="_blank" class="green" href="http://Lacoste.com.cn">LACOSTE官方网站</a>
</li>
<li><a target="_blank" class="blue" href="http://mall.jd.com/view_page-21935589.html">京东旗舰店</a>
</li>
<!-- <li><a class="grey" href="http://1111.lt12.cn/info">0元飞巴黎</a>
</li>
<li><a class="red" href="http://1111.lt12.cn/lookbook">产品型录</a>
</li>
<li><a class="green" href="http://1111.lt12.cn/redclay">趣扫红土场</a>
</li>
<li><a class="blue" href="http://1111.lt12.cn/store">查找活动门店</a>
</li>
<li><a class="grey" href="http://mall.jd.com/view_page-21935589.html">京东旗舰店</a>
</li> -->
</ul>
</nav>
</aside>
<!-- Menu End -->
<!-- Page Content -->
<section class="main">
<div id="flux-site">
<h1 class="logo">
<a href="javascript:;">
<img src="css/front/logo.png" alt="">
</a>
</h1>
<div class="partie" id="equipe">
<div class="block-container" style="opacity: 1;">
<div class="block-content">
<div class="content-partie">
<div class="intro-partie">
<div _index="0" class="col" id="man-1">
<div class="cadre-photo">
<div class="first-photo" style="display:none;">
<img src="images/model_pauline/MAN1-3x3.png">
</div>
<div class="white-photo" style="display:none;">
<img src="images/model_pauline/MAN1-5x3.png">
</div>
<div class="anim-photo">
<img id="jc" class="photo-viensla" src="images/model_pauline/MAN1-1x3.png">
</div>
</div>
</div>
<div _index="1" class="col" id="man-2">
<div class="cadre-photo">
<div class="first-photo" style="display:none;">
<img src="images/model_pauline/MAN2-4x3.png">
</div>
<div class="white-photo" style="display:none;">
<img src="images/model_pauline/MAN2-6x3.png">
</div>
<div class="anim-photo">
<img id="niko" class="photo-viensla" src="images/model_pauline/MAN2-2x3.png">
</div>
</div>
</div>
<div _index="2" class="col" id="man-3">
<div class="cadre-photo">
<div class="first-photo" style="display:none;">
<img src="images/model_pauline/MAN3-3x3.png">
</div>
<div class="white-photo" style="display:none;">
<img src="images/model_pauline/MAN3-5x3.png">
</div>
<div class="anim-photo">
<img id="fred" class="photo-viensla" src="images/model_pauline/MAN3-1x3.png">
</div>
</div>
</div>
<div _index="3" class="col" id="man-4">
<div class="cadre-photo">
<div class="first-photo" style="display:none;">
<img src="images/model_pauline/MAN4-3x3.png">
</div>
<div class="white-photo" style="display:none;">
<img src="images/model_pauline/MAN4-5x3.png">
</div>
<div class="anim-photo">
<img id="fred" class="photo-viensla" src="images/model_pauline/MAN4-1x3.png">
</div>
</div>
</div>
<div _index="4" class="col" id="man-5">
<div class="cadre-photo">
<div class="first-photo" style="display:none;">
<img src="images/model_pauline/MAN5-3x3.png">
</div>
<div class="white-photo" style="display:none;">
<img src="images/model_pauline/MAN5-5x3.png">
</div>
<div class="anim-photo">
<img id="niko" class="photo-viensla" src="images/model_pauline/MAN5-1x3.png">
</div>
</div>
</div>
<div _index="5" class="col" id="man-6">
<div class="cadre-photo">
<div class="first-photo" style="display:none;">
<img src="images/model_pauline/MAN6-3x3.png">
</div>
<div class="white-photo" style="display:none;">
<img src="images/model_pauline/MAN6-5x3.png">
</div>
<div class="anim-photo">
<img id="jc" class="photo-viensla" src="images/model_pauline/MAN6-1x3.png?v=20150531">
</div>
</div>
</div>
<div class="click-fix-4"></div>
<div class="click-fix-5"></div>
<div class="click-fix-6"></div>
<div class="click-mask-1"></div>
<div class="click-mask-2"></div>
<div class="click-mask-3"></div>
<div class="click-mask-4"></div>
<div class="click-mask-5"></div>
<div class="click-mask-6"></div>
<div class="click-mask-7"></div>
<div class="click-mask-8"></div>
<div class="bench"></div>
<div class="ground"><img src="css/img/ground.png" alt=""></div>
</div>
</div>
</div>
</div>
</div>
<div class="ribbon ribbon-blue"></div>
<div class="ribbon ribbon-red"></div>
<div class="ribbon ribbon-green"></div>
</div>
<div class="racket"><img src="css/img/racket.png" alt=""></div>
<a class="read-tc" href="javascript:;">法律声明条款</a>
<span class="icp">沪ICP备13005267号-17</span>
</section>
<div class="main-mask"></div>
<div id="tennisball">
<svg class="svg" xmlns="http://www.w3.org/2000/svg" version="1.1">
<image x="0" y="0" height="60" width="60" xlink:href="css/front/tennisball.svg"/>
</svg>
<img class="png" src="css/front/tennisball.png" alt="">
<img class="gif" style="display:none" src="css/front/tennisball.gif">
</div>
<!-- End Page Content -->
<div class="detail-box for_man-1">
<button class="close">关闭</button>
<h3>LT12限量系列灰色T恤衫</h3>
<div class="pic">
<img src="images/product/01.png" alt="">
</div>
<span class="price">价格：590 元</span>
<a target="_blank" href="http://item.jd.com/1543278289.html">立即购买</a>
</div>
<div class="detail-box for_man-2">
<button class="close">关闭</button>
<h3>LT12限量系列蓝色POLO衫</h3>
<div class="pic">
<img src="images/product/02.png" alt="">
</div>
<span class="price">价格：990 元</span>
<a class="soldout" href="javascript:;">已售罄</a>
</div>
<div class="detail-box for_man-3">
<button class="close">关闭</button>
<h3>LT12限量系列白色T恤衫</h3>
<div class="pic">
<img src="images/product/03.png" alt="">
</div>
<span class="price">价格：590 元</span>
<a target="_blank" href="http://item.jd.com/1494360810.html">立即购买</a>
</div>
<div class="detail-box for_man-4">
<button class="close">关闭</button>
<h3>LT12限量系列蓝色T恤衫</h3>
<div class="pic">
<img src="images/product/04.png" alt="">
</div>
<span class="price">价格：590 元</span>
<a target="_blank" href="http://item.jd.com/1570980480.html">立即购买</a>
</div>
<div class="detail-box for_man-5">
<button class="close">关闭</button>
<h3>LT12限量系列深蓝色T恤衫</h3>
<div class="pic">
<img src="images/product/05.png" alt="">
</div>
<span class="price">价格：590 元</span>
<a target="_blank" href="http://item.jd.com/1494360490.html">立即购买</a>
</div>
<div class="detail-box for_man-6">
<button class="close">关闭</button>
<h3>LT12限量系列黑色POLO衫</h3>
<div class="pic">
<img src="images/product/06.png" alt="">
</div>
<span class="price">价格：990 元</span>
<a target="_blank" href="http://item.jd.com/1543274075.html">立即购买</a>
</div>
<div class="detail-box for_racket">
<button class="close">关闭</button>
<h3>LT12限量系列网球拍</h3>
<div class="pic">
<img src="images/product/07.png" alt="">
</div>
<span class="price">价格：4990 元</span>
<a target="_blank" href="http://item.jd.com/1552558895.html">立即购买</a>
</div>
<!-- PRODUCT DETAIL -->
<!-- PRODUCT DETAIL END -->
<!-- LOADING PAGE -->
<!-- 页面载入时loading-page淡入addClass=show 加载完成removeClass=show 两秒后淡出 -->
<div class="loading-page" style="display:none">
<div class="inner">
<h1><img src="css/front/logo.png" alt=""></h1>
<span class="progress">0%</span>
</div>
<div class="ribbon ribbon-blue"></div>
<div class="ribbon ribbon-red"></div>
<div class="ribbon ribbon-green"></div>
</div>
<!-- END LOADING PAGE -->
<!-- GAME GUIDE -->
<div class="game-guide show">
<div class="inner">
<button class="close">关闭</button>
<p>
<span>左右滑动网球</span>
<span>点击模特</span>
<span>查看商品详情</span>
</p>
</div>
</div>
<!-- END GAME GUIDE -->
<!-- TC -->
<div class="tc">
<h4>法律声明条款</h4>
<button class="close">关闭</button>
<div class="inner">
<p>
本文所述为由位于上海市黄浦区徐家汇路610号日月光中心26层01&06-10室的梦田服装（上海）有限公司（简称“LACOSTE”）所有并由上海佛海佛瑞广告有限公司（Fred and Farid (Shanghai) Advertising Co. Ltd.，简称“FFC”）代表LACOSTE运营和/或维护的临时网站“LT12 mini-site”（简称“网页”）的正式条款与条件。 本条款与条件期限自 2015 年 5 月 1 日起至 2015 年 6 月 30 日止。 本条款与条件说明了您参与活动、浏览网页的义务、责任及权利，因此请仔细阅读本条款与条件，以确保您充分理解并遵守。若您不同意本条款与条件的任何一条，则不得参与活动、浏览网页。在进入和进行页面浏览之前，您特此同意受本条款与条件的如下规定：
</p>
<h5>承诺</h5>
<p>
1.参与者应按照本网站条款与条件、游戏规则及任何相关法律，真诚地参与活动、浏览网页、进行游戏。
</p>
<p>
2.LACOSTE不声明也不保证您可以在您的司法管辖区内参与活动、浏览网页、进行游戏。 若您（或您获悉您）受所在司法管辖区的任何法律、法规、细则或条例规限，上述规例禁止或限制您根据本网站条款与条件及规则参与/浏览网页/进行游戏（下文统称“限制”），则您应马上中止参与活动、浏览网页、进行游戏。
</p>
<p>
3.在忽略上述限制继续参与活动、浏览网页、进行游戏前，您特此：
</p>
<ul>
<li>a.承诺就由于上述限制可能引起或产生的任何及所有起诉、诉讼、索赔、损失、损害和/或开支，向LACOSTE及 FFC 以及他们各自的员工、代理及承包商（下文统称“关联人”）负全部赔偿责任，并使他们不受损失；</li>
<li>b.同意您不会就任何奖励或任何其他权利或权益向LACOSTE、FFC 或他们各自的任何关联人提起任何诉讼、提出索赔、补偿或赔偿。</li>
</ul>
<p>
4.参与者不得制作、复制、发布或传播包含下列任何内容的信息：
</p>
<ul>
<li>a.违背参与者所在国家宪法所载基本原则的信息；</li>
<li>b.威胁参与者所在国家的国家安全、泄露国家机密或颠覆政府的信息；</li>
<li>c.对参与者所在国家的名誉及利益构成损害的信息；</li>
<li>d.煽动参与者所在国家的民族仇恨或民族歧视、破坏国家统一或社会稳定的信息；</li>
<li>e.污蔑或诋毁任何宗教信仰的信息；</li>
<li>f.传播色情或其他淫秽材料的信息；</li>
<li>g.受适用法律或参与者所在国家的法律禁止的，宣传赌博、暴力、杀戮或恐怖主义、或教唆犯罪的信息；</li>
<li>h.受适用法律或参与者所在国家的法律禁止的，侮辱或诽谤他人、侵害他人合法权利及利益的信息；</li>
<li>i.适用法律或参与者所在国家的法律禁止的任何信息。</li>
</ul>
<p>
5.参与者不得参与、协助或试图参与、协助任何攻击游戏服务器的行为，或从事涉及干扰游戏运行运作方式的任何行为，或可能修改游戏（或其任何部分）、导致游戏（或其任何部分）受破坏或出错的行为。参与者应就任何上述行为导致的任何民事和/或刑事责任负全责。
</p>
<h5>责任免除</h5>
<p>
受适用法律对上述免责及限制的规限（如适用），请仔细阅读本“责任免除”条文，这些条文免除或限制LACOSTE就您参与游戏而对您负有的法律责任。
</p>
<p>
1.游戏以现有状态供参与者使用。 并没有就游戏或就所提供的与游戏相关的任何信息及材料作出任何形式的保证、承诺或声明（无论明示或暗示），LACOSTE明确表示在任何适用法律许可的最大范围内，不就任何及所有保证承担责任。为免有任何疑问，在不影响上述整体内容的情况下，LACOSTE并无就权属；不侵犯第三方权利；适销性；满意度；适用于某特定目的；内容的准确性、可靠性及完整性；或游戏将是安全且不受黑客、病毒、间谍软件、木马、蠕虫病毒或其他恶意、有破坏性的或受感染的代码、媒介、程序或宏病毒影响，或不会损坏任何数据、程序或财产作出任何保证。
</p>
<p>
2.LACOSTE明确不就任何使用者使用、进入或参与游戏时由于下列任何情况而产生的任何及所有责任（无论是合约、侵权、疏忽、法定责任或其他，但需受任何适用法律所规限（如适用））负责，上述情况包括但不限于：
</p>
<ul>
<li>a.网页存在任何错误或疏忽； </li>
<li>b.使用、进入或参与网页发生任何延迟或中断（无论是由于连接问题、软硬件问题或其他原因）；</li>
<li>c.未经授权第三方对网页内容作出任何变动、修改或改动；</li>
<li>d.网页不可用；</li>
<li>e.参与者提供的个人信息遭损毁；</li>
<li>f.游戏或任何相关流程的不当操作/管理；</li>
<li>g.颁发或授予任何奖励受任何法律和/或监管禁止或限制。</li>
</ul>
<p>
3.在任何情况下，LACOSTE、FFC 或他们各自的任何关联人仍不会对参与者由于或就参与游戏而可能直接或间接遭受或产生的下列任何事项负责：
</p>
<ul>
<li>a.经济损失（包括但不限于收入、数据、利润、合同、使用、机会、商业或预期的储蓄的损失）；</li>
<li>b.商誉或声誉的损失；</li>
<li>c.特定、意外或间接损失或损害；</li>
<li>d.费用或开支。</li>
</ul>
<p>上述针对任何参与者的损失或损害因其参与网页或由参与网页引发而使参与者直接或间接遭受或产生。</p>
<p>
4.若由于不可抗力或任何不受LACOSTE合理控制且LACOSTE对其原因并无责任的事件，LACOSTE无法遵守游戏条款与条件或游戏规则，则其不应承担责任。
</p>
<p>
5.参与游戏表明知悉及接受互联网的特性与限制，若干信息可能会因缺乏保护而被滥用或盗用，以及有被系统中任何病毒感染的风险。每名参与者有责任采取一切合理措施，保护其电脑和电话设备所载有的自身数据及/或软件免受任何攻击。任何人应对其连接网站及参与游戏的行为负全责。
</p>
<p>
6.LACOSTE保留其于任何时间全权酌情停止或中断网页运行的权利。
</p>
<p>
7.LACOSTE保留就任何参与者在网页中作弊采取法律行动的权利。
</p>
<h5>知识产权</h5>
<p>
网页包含多个商标或服务标识（统称“商标”）。 除非事先取得商标所有人及授权使用人（包括LACOSTE）的书面同意，否则您无权下载、复制或使用任何商标，更不得对商标图形进行修改。
</p>
<h5>执行</h5>
<p>
1.若本网页条款与条件的任何条文被认定不可执行，则该条文应为无效，且不得影响其余条文的有效性及可执行性。此外，在适用法律许可的范围内，LACOSTE可以使用其他有效、可执行且与不可执行的条文意图最相近的条文取代该条文（诚如LACOSTE可能合理决定）。
</p>
<h5>监管法律及争议解决</h5>
<p>
1.本游戏条款与条件应受中国的法律监管，并应据此解读。
</p>
<p>
2.与本游戏条款与条件相关的任何争议应提请LACOSTE所在地的法院（应作为唯一的司法管辖区）解决。
</p>
<h5>其他事项</h5>
<p>
1.LACOSTE保留随时全权酌情行使终止向您授权使用、进入及浏览网页的权利。
</p>
<p>
2.除非LACOSTE同意，否则本游戏条款与条件不得更改或修改。
</p>
<p>
3.LACOSTE应有全权酌情行使设定及修改游戏规则的权利，且LACOSTE就游戏规则的解读及执行作出的任何决定对所有参与者而言属最终及具有约束力。
</p>
<p>
4.若本网页条款及条件被翻译为其他语言，应以中文版本为准。
</p>
</div>
</div>
<!-- END TC -->
<script type="text/javascript" src="js/jquery.transit.min.js"></script>
<script>
$('.loading-page').css('display','block');
$('.loading-page').addClass('show');
/*set content size*/
function setContentSize() {
var ww = ($(window).width() < 980) ? 980 : $(window).width();
var wh = ($(window).height() < 550) ? 550 : $(window).height();
$("body").css({width: ww});
$("h1.logo").css({width: ww*0.08, marginLeft: -ww*0.04})
/*main*/
$(".main").css({width: ww});
$(".main-mask").css({width: ww});
$(".ribbon").css({height: ww*0.008});
$(".intro-partie").css({width: ww});
$("#equipe .block-content .content-partie .intro-partie .col").css({
width: ww*0.28,
height: ww*0.308
});
$("#equipe .block-content .content-partie .intro-partie .col#man-1").css({
marginLeft: -ww*0.47
});
$("#equipe .block-content .content-partie .intro-partie .col#man-2").css({
marginLeft: -ww*0.25
});
$("#equipe .block-content .content-partie .intro-partie .col#man-3").css({
marginLeft: -ww*0.05
});
$("#equipe .block-content .content-partie .intro-partie .col#man-4").css({
bottom: ww*0.113,
marginLeft: -ww*0.345
});
$("#equipe .block-content .content-partie .intro-partie .col#man-5").css({
bottom: ww*0.113,
marginLeft: -ww*0.28/1.9
});
$("#equipe .block-content .content-partie .intro-partie .col#man-6").css({
bottom: ww*0.113,
marginLeft: ww*0.08
});
$(".click-fix-4").css({
width: ww*0.06,
height: ww*0.23,
marginLeft: -ww*0.195,
bottom: ww*0.15,
});
$(".click-fix-5").css({
width: ww*0.06,
height: ww*0.23,
marginLeft: 0,
bottom: ww*0.14,
});
$(".click-fix-6").css({
width: ww*0.06,
height: ww*0.23,
marginLeft: ww*0.225,
bottom: ww*0.14,
});
$(".click-mask-1").css({
width: ww*0.145,
height: ww*0.3,
bottom: ww*0,
left: 0
});
$(".click-mask-2").css({
width: ww*0.14,
height: ww*0.2,
bottom: ww*0.21,
marginLeft: -ww*0.44
});
$(".click-mask-3").css({
width: ww*0.11,
height: ww*0.2,
bottom: ww*0.28,
marginLeft: -ww*0.11
});
$(".click-mask-4").css({
width: ww*0.7,
height: ww*0.1,
bottom: ww*0.375,
marginLeft: -ww*0.35
});
$(".click-mask-5").css({
width: ww*0.15,
height: ww*0.2,
bottom: ww*0.3,
marginLeft: ww*0.07
});
$(".click-mask-6").css({
width: ww*0.15,
height: ww*0.2,
bottom: ww*0.3,
marginLeft: ww*0.285
});
$(".click-mask-7").css({
width: ww*0.03,
height: ww*0.11,
bottom: 0,
marginLeft: ww*0.025
});
$(".click-mask-8").css({
width: ww*0.06,
height: ww*0.11,
bottom: 0,
marginLeft: -ww*0.205
});
$(".bench").css({height: ww*0.119});
$(".racket").css({
width: ww*0.085,
marginLeft: ww*0.275
});
$("#tennisball").css({
left: ww-60-0.048*ww+22
});
/*detail-box*/
$(".detail-box").css({
width: ww*0.24,
height: ww*0.35
});
$(".detail-box.for_man-1, .detail-box.for_man-2, .detail-box.for_man-4").css({
marginRight: -ww*0.34
});
$(".detail-box.for_man-3, .detail-box.for_man-5, .detail-box.for_man-6").css({
marginLeft: -ww*0.34
});
$(".detail-box.for_racket").css({
marginLeft: -ww*0.12-40
});
$(".detail-box .pic").css({
height: ww*0.32-120
});
$(".detail-box a").css({
height: ww*0.025,
lineHeight: ww*0.025+'px'
});
$("body").css({height: wh});
$("h1.logo").css({top: wh*0.036});
$(".main").css({height: wh});
$(".main-mask").css({height: wh});
$(".intro-partie").css({height: wh});
$("#tennisball").css({
top: wh-980*0.36
});
$(".detail-box").css({
bottom: wh*0.093
});
};
setContentSize();
$(window).resize(function(){
setContentSize();
}).resize();
$(".racket").click(function(){
// if ($('.main').hasClass('showing')) {
// return;
// }
$('.main').addClass('showing');
$(".detail-box").removeClass("show");
$(".col").addClass("blur");
$(".col").removeClass("active");
$(".detail-box.for_racket").addClass("show");
});
$(".game-guide .close").click(function(){
$('#tennisball').find('.png,.svg').hide();
$('#tennisball').css({'z-index':999});
$('#tennisball').find('.gif').show();
$(".game-guide").removeClass("show");
setTimeout(function() {
$('#tennisball').find('.gif').hide();
$('#tennisball').css({'z-index':200});
$('#tennisball').find('.png,.svg').show();
},1000);
});
/*Product Detail*/
$("#equipe .block-content .content-partie .intro-partie .col").click(function(){
// if ($('.main').hasClass('showing')) {
// return;
// }
$('.main').addClass('showing');
// $('#tennisball').css({'z-index':999});
var _id=$(this).attr('id');
var _detail = $('.detail-box.for_'+_id);
$(".detail-box").removeClass("show");
$(this).siblings(".col").addClass("blur");
$(this).siblings(".col").removeClass("active");
$(this).removeClass("blur");
$(this).addClass("active");
_detail.addClass("show");
});
$(".detail-box .close").click(function(e){
$('#tennisball').find('.png,.svg').hide();
$('#tennisball').find('.gif').show();
$(".detail-box").removeClass("show");
$(".main").removeClass("white showing");
$("#equipe .block-content .content-partie .intro-partie .col").removeClass("active").removeClass("blur");
setTimeout(function() {
$('#tennisball').find('.gif').hide();
$('#tennisball').css({'z-index':200});
$('#tennisball').find('.png,.svg').show();
},1000);
});
$(".click-fix-4").click(function(){
// if ($('.main').hasClass('showing')) {
// return;
// }
$('.main').addClass('showing');
$(".detail-box").removeClass("show");
$(".col#man-4").siblings(".col").addClass("blur");
$(".col#man-4").siblings(".col").removeClass("active");
$(".col#man-4").removeClass("blur");
$(".col#man-4").addClass("active");
$(".detail-box.for_man-4").addClass("show");
});
$(".click-fix-5").click(function(){
// if ($('.main').hasClass('showing')) {
// return;
// }
$('.main').addClass('showing');
$(".detail-box").removeClass("show");
$(".col#man-5").siblings(".col").addClass("blur");
$(".col#man-5").siblings(".col").removeClass("active");
$(".col#man-5").removeClass("blur");
$(".col#man-5").addClass("active");
$(".detail-box.for_man-5").addClass("show");
});
$(".click-fix-6").click(function(){
// if ($('.main').hasClass('showing')) {
// return;
// }
$('.main').addClass('showing');
$(".detail-box").removeClass("show");
$(".col#man-6").siblings(".col").addClass("blur");
$(".col#man-6").siblings(".col").removeClass("active");
$(".col#man-6").removeClass("blur");
$(".col#man-6").addClass("active");
$(".detail-box.for_man-6").addClass("show");
});
$(".racket").click(function(){
// if ($('.main').hasClass('showing')) {
// return;
// }
$('.main').addClass('showing');
$(".detail-box").removeClass("show");
$(".col").addClass("blur");
$(".col").removeClass("active");
$(".detail-box.for_racket").addClass("show");
});
/*menu*/
$(".menu-button").click(function(){
if(!$(this).hasClass("in")){
$(this).addClass("in");
$(".menu").addClass("show");
$(".main-mask").addClass("show");
} else {
$(this).removeClass("in");
$(".menu").removeClass("show");
$(".main-mask").removeClass("show");
}
});
$(".main-mask").click(function(){
$(this).removeClass("show");
$(".menu-button").removeClass("in");
$(".menu").removeClass("show");
});
$(".read-tc").click(function(){
$(".tc").addClass("show");
});
$(".tc .close").click(function(){
$(".tc").removeClass("show");
});
</script>
<script type="text/javascript" src="js/common_front.js"></script>
</body>
</html>