作者 zhangwei
1 个管道 的构建 通过 耗费 2 秒

修改页面样式

  1 +{
  2 + "liveServer.settings.port": 5501
  3 +}
@@ -10,10 +10,58 @@ @@ -10,10 +10,58 @@
10 <link rel="stylesheet" href="__TMPL__/public/assets/css/index.css" /> 10 <link rel="stylesheet" href="__TMPL__/public/assets/css/index.css" />
11 <script src="__TMPL__/public/assets/js/base.js"></script> 11 <script src="__TMPL__/public/assets/js/base.js"></script>
12 <title>星享体验</title> 12 <title>星享体验</title>
  13 + <style>
  14 + .first_search,
  15 + .first_search_left {
  16 + display: flex;
  17 + display: -webkit-flex;
  18 + align-items: center;
  19 + }
  20 +
  21 + .first_search_left_img {
  22 + width: 0.2rem;
  23 + height: 0.22rem;
  24 + }
  25 +
  26 + .first_search_right_img {
  27 + width: 0.2rem;
  28 + height: 0.2rem;
  29 + }
  30 +
  31 + .first_search_right_img img {
  32 + width: 100%;
  33 + height: 100%;
  34 + display: block;
  35 + }
  36 +
  37 + .first_search_left_img img {
  38 + width: 100%;
  39 + height: 100%;
  40 + display: block;
  41 + }
  42 +
  43 + .first_searchUl {
  44 + display: none;
  45 + width: 2.6rem;
  46 + height: 2.4rem;
  47 + overflow-y: scroll;
  48 + position: absolute;
  49 + top: 0.6rem;
  50 + left: 0.26rem;
  51 + z-index: 100;
  52 + }
  53 +
  54 + .first_searchUl li {
  55 + background-color: white;
  56 + padding: 0.1rem 0.18rem;
  57 + box-sizing: border-box;
  58 + border-top: 1px solid #D4DCEB;
  59 + }
  60 + </style>
13 </head> 61 </head>
14 62
15 <body> 63 <body>
16 - <include file="public@header"/> 64 + <include file="public@header" />
17 <!-- banner --> 65 <!-- banner -->
18 <div class="first_top"> 66 <div class="first_top">
19 <div class="first_top_img"> 67 <div class="first_top_img">
@@ -31,15 +79,19 @@ @@ -31,15 +79,19 @@
31 <div class="first_search_left_img"> 79 <div class="first_search_left_img">
32 <img src="__TMPL__/public/assets/images/cicon_06@2x.png" alt="" /> 80 <img src="__TMPL__/public/assets/images/cicon_06@2x.png" alt="" />
33 </div> 81 </div>
34 - <div class="first_search_left_word">  
35 - 澳大利亚  
36 - </div> 82 + <div class="first_search_left_word">澳大利亚</div>
37 </div> 83 </div>
38 <div class="first_search_right"> 84 <div class="first_search_right">
39 <div class="first_search_right_img"> 85 <div class="first_search_right_img">
40 - <img src="__TMPL__/public/assets/images/cicon_49@2x.png" alt="" /> 86 + <img src="__TMPL__/public/assets/images/down2.png" alt="" />
41 </div> 87 </div>
42 </div> 88 </div>
  89 + <ul class="first_searchUl">
  90 + <li class="one-txt-cut">1</li>
  91 + <li class="one-txt-cut">2</li>
  92 + <li class="one-txt-cut">3</li>
  93 + <li class="one-txt-cut">4</li>
  94 + </ul>
43 </div> 95 </div>
44 <!-- 亲临现场 --> 96 <!-- 亲临现场 -->
45 <div class="first_scene"> 97 <div class="first_scene">
@@ -50,9 +102,7 @@ @@ -50,9 +102,7 @@
50 </div> 102 </div>
51 <div class="first_scene_top_ch">亲临<span>现场</span> 103 <div class="first_scene_top_ch">亲临<span>现场</span>
52 </div> 104 </div>
53 - <div class="first_scene_top_en">  
54 - On Spot  
55 - </div> 105 + <div class="first_scene_top_en">On Spot </div>
56 </div> 106 </div>
57 </div> 107 </div>
58 <!-- 亲临现场 --> 108 <!-- 亲临现场 -->
@@ -65,11 +115,11 @@ @@ -65,11 +115,11 @@
65 <li class="swiper-slide"> 115 <li class="swiper-slide">
66 <div class="first_galley_contant"> 116 <div class="first_galley_contant">
67 <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}"> 117 <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}">
68 - <div class="first_galley_contant_img"> 118 + <div class="first_galley_contant_img" style="height:5rem;">
69 <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" /> 119 <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" />
70 </div> 120 </div>
71 <div class="first_galley_contant_title"> 121 <div class="first_galley_contant_title">
72 - <div class="first_galley_contant_title_top"> 122 + <div class="first_galley_contant_title_top one-txt-cut">
73 {$vo.post_title} 123 {$vo.post_title}
74 </div> 124 </div>
75 <div class="first_galley_contant_title_bottom txt-cut" style="-webkit-line-clamp: 2;"> 125 <div class="first_galley_contant_title_bottom txt-cut" style="-webkit-line-clamp: 2;">
@@ -101,18 +151,18 @@ @@ -101,18 +151,18 @@
101 <!-- 市井漫游 --> 151 <!-- 市井漫游 -->
102 <div class="first_gallery first_town"> 152 <div class="first_gallery first_town">
103 <!-- 图片 --> 153 <!-- 图片 -->
104 - <div class="star_gall_img swiper-container"> 154 + <div class="star_gall_img swiper-container2">
105 <!-- 轮播图 --> 155 <!-- 轮播图 -->
106 <ul class="swiper-wrapper"> 156 <ul class="swiper-wrapper">
107 <volist name="res_sjmy" id="vo"> 157 <volist name="res_sjmy" id="vo">
108 <li class="swiper-slide"> 158 <li class="swiper-slide">
109 <div class="first_galley_contant"> 159 <div class="first_galley_contant">
110 <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}"> 160 <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}">
111 - <div class="first_galley_contant_img"> 161 + <div class="first_galley_contant_img" style="height:6rem;">
112 <img src="{:cmf_get_image_url($vo.index_thumbnail2)}" alt="" /> 162 <img src="{:cmf_get_image_url($vo.index_thumbnail2)}" alt="" />
113 </div> 163 </div>
114 <div class="first_galley_contant_title"> 164 <div class="first_galley_contant_title">
115 - <div class="first_galley_contant_title_top"> 165 + <div class="first_galley_contant_title_top one-txt-cut">
116 {$vo.post_title} 166 {$vo.post_title}
117 </div> 167 </div>
118 <div class="first_galley_contant_title_bottom txt-cut" style="-webkit-line-clamp: 2;"> 168 <div class="first_galley_contant_title_bottom txt-cut" style="-webkit-line-clamp: 2;">
@@ -151,11 +201,11 @@ @@ -151,11 +201,11 @@
151 <li class="swiper-slide"> 201 <li class="swiper-slide">
152 <div class="first_galley_contant"> 202 <div class="first_galley_contant">
153 <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}"> 203 <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}">
154 - <div class="first_galley_contant_img"> 204 + <div class="first_galley_contant_img" style="height:5rem;">
155 <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" /> 205 <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" />
156 </div> 206 </div>
157 <div class="first_galley_contant_title"> 207 <div class="first_galley_contant_title">
158 - <div class="first_galley_contant_title_top"> 208 + <div class="first_galley_contant_title_top one-txt-cut">
159 {$vo.post_title} 209 {$vo.post_title}
160 </div> 210 </div>
161 <div class="first_galley_contant_title_bottom txt-cut" style="-webkit-line-clamp: 2;"> 211 <div class="first_galley_contant_title_bottom txt-cut" style="-webkit-line-clamp: 2;">
@@ -194,11 +244,11 @@ @@ -194,11 +244,11 @@
194 <li class="swiper-slide"> 244 <li class="swiper-slide">
195 <div class="first_galley_contant"> 245 <div class="first_galley_contant">
196 <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}"> 246 <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}">
197 - <div class="first_galley_contant_img"> 247 + <div class="first_galley_contant_img" style="height:5rem;">
198 <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" /> 248 <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" />
199 </div> 249 </div>
200 <div class="first_galley_contant_title"> 250 <div class="first_galley_contant_title">
201 - <div class="first_galley_contant_title_top"> 251 + <div class="first_galley_contant_title_top one-txt-cut">
202 {$vo.post_title} 252 {$vo.post_title}
203 </div> 253 </div>
204 <div class="first_galley_contant_title_bottom"> 254 <div class="first_galley_contant_title_bottom">
@@ -214,12 +264,25 @@ @@ -214,12 +264,25 @@
214 </div> 264 </div>
215 </div> 265 </div>
216 <!--底部--> 266 <!--底部-->
217 - <include file="public@footer"/> 267 + <include file="public@footer" />
218 </body> 268 </body>
219 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script> 269 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
220 <script src="__TMPL__/public/assets/js/swiper.min.js"></script> 270 <script src="__TMPL__/public/assets/js/swiper.min.js"></script>
221 <script src="__TMPL__/public/assets/js/public.js"></script> 271 <script src="__TMPL__/public/assets/js/public.js"></script>
222 <script> 272 <script>
  273 + $('.first_search').click(function() {
  274 + if ($('.first_search_right_img img').attr('src') == "__TMPL__/public/assets/images/down2.png") {
  275 + $('.first_search_right_img img').attr('src', "__TMPL__/public/assets/images/upjian.png");
  276 + $('.first_searchUl').show();
  277 + } else {
  278 + $('.first_search_right_img img').attr('src', "__TMPL__/public/assets/images/down2.png");
  279 + $('.first_searchUl').hide();
  280 + }
  281 + });
  282 + $('.first_searchUl li').click(function() {
  283 + var txt = $(this).text();
  284 + $('.first_search_left_word').text(txt);
  285 + });
223 // 星域秀场视频 286 // 星域秀场视频
224 var video = document.getElementById("video"); 287 var video = document.getElementById("video");
225 288
@@ -230,7 +293,13 @@ @@ -230,7 +293,13 @@
230 } 293 }
231 // swiper 294 // swiper
232 var swiper = new Swiper(".swiper-container", { 295 var swiper = new Swiper(".swiper-container", {
233 - slidesPerView: 1.4, 296 + slidesPerView: 1.3,
  297 + paginationClickable: true,
  298 + spaceBetween: 10,
  299 + freeMode: true
  300 + });
  301 + var swiper = new Swiper('.swiper-container2', {
  302 + slidesPerView: 1.1,
234 paginationClickable: true, 303 paginationClickable: true,
235 spaceBetween: 10, 304 spaceBetween: 10,
236 freeMode: true 305 freeMode: true
@@ -9,14 +9,14 @@ @@ -9,14 +9,14 @@
9 <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/swiper3/swiper.min.css" /> 9 <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/swiper3/swiper.min.css" />
10 <link rel="stylesheet" href="__TMPL__/public/assets/css/happy.css" /> 10 <link rel="stylesheet" href="__TMPL__/public/assets/css/happy.css" />
11 <link rel="stylesheet" href="__TMPL__/public/assets/css/mask.css" /> 11 <link rel="stylesheet" href="__TMPL__/public/assets/css/mask.css" />
12 - <title>星享体验详情</title> 12 + <title>星享体验详情 </title>
13 </head> 13 </head>
14 14
15 <body> 15 <body>
16 - <include file="public@header"/> 16 + <include file="public@header" />
17 <div class="mask"> 17 <div class="mask">
18 </div> 18 </div>
19 - <include file="public@slide"/> 19 + <include file="public@slide" />
20 <div class="happy_foreignBox2"> 20 <div class="happy_foreignBox2">
21 <!--banner--> 21 <!--banner-->
22 <div class="hp_forImg"> 22 <div class="hp_forImg">
@@ -48,8 +48,8 @@ @@ -48,8 +48,8 @@
48 </div> 48 </div>
49 </div> 49 </div>
50 <!--评论--> 50 <!--评论-->
51 - <include file="public@comment"/>  
52 - <include file="public@footer"/> 51 + <include file="public@comment" />
  52 + <include file="public@footer" />
53 <script src="__TMPL__/public/assets/js/base.js"></script> 53 <script src="__TMPL__/public/assets/js/base.js"></script>
54 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script> 54 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
55 <script src="__TMPL__/public/assets/swiper3/swiper.min.js"></script> 55 <script src="__TMPL__/public/assets/swiper3/swiper.min.js"></script>
@@ -44,8 +44,15 @@ @@ -44,8 +44,15 @@
44 </head> 44 </head>
45 45
46 <body> 46 <body>
  47 + <div class="vi_maks">
  48 + <div class="vi_video">
  49 + <video src="{:cmf_get_file_download_url($res_xqyy.video)}" id="video2" style="height: 3.4rem;width: 100%;" autoplay="autoplay" controls controlslist="nodownload"></video>
  50 + <img class="vi_Img" src="__TMPL__/public/assets/images/nos.png" alt="" />
  51 + </div>
  52 +
  53 + </div>
47 <!-- 顶部导航 --> 54 <!-- 顶部导航 -->
48 - <include file="public@header"/> 55 + <include file="public@header" />
49 <div class="top"> 56 <div class="top">
50 <div class="top_img swiper-container4"> 57 <div class="top_img swiper-container4">
51 <div class="swiper-wrapper"> 58 <div class="swiper-wrapper">
@@ -66,6 +73,21 @@ @@ -66,6 +73,21 @@
66 </div> 73 </div>
67 </div> 74 </div>
68 <div class="top_state_address"> 75 <div class="top_state_address">
  76 + <div class="state_north_ame statr_99">
  77 + <div class="state_img">
  78 + <img src="__TMPL__/public/assets/images/cicon_05@2x.png" alt="" />
  79 + </div>
  80 + <div class="state_state_name">
  81 + <span>北极</span>
  82 + <ul class="star_happy_box">
  83 + <notempty name="res_city.20.name">
  84 + <volist name="res_city.20.name" id="vo">
  85 + <li><a href="/portal/star/index?city_id={$vo.id}">{$vo.name}</a></li>
  86 + </volist>
  87 + </notempty>
  88 + </ul>
  89 + </div>
  90 + </div>
69 <div class="state_north_ame statr_one"> 91 <div class="state_north_ame statr_one">
70 <div class="state_img"> 92 <div class="state_img">
71 <img src="__TMPL__/public/assets/images/cicon_05@2x.png" alt="" /> 93 <img src="__TMPL__/public/assets/images/cicon_05@2x.png" alt="" />
@@ -517,7 +539,7 @@ @@ -517,7 +539,7 @@
517 <!-- 视频 --> 539 <!-- 视频 -->
518 <notempty name="res_xqyy"> 540 <notempty name="res_xqyy">
519 <div class="video_bg"> 541 <div class="video_bg">
520 - <video id="video" width="100%" style="height:100%;" src="{:cmf_get_file_download_url($res_xqyy.video)}"></video> 542 + <video id="video" width="100%" style="height:100%;" src="{:cmf_get_file_download_url($res_xqyy.video)}" controlslist="nodownload"></video>
521 </div> 543 </div>
522 <!-- 封面 --> 544 <!-- 封面 -->
523 <div class="fm_IMG"> 545 <div class="fm_IMG">
@@ -631,7 +653,7 @@ @@ -631,7 +653,7 @@
631 <div class="recommed_contant_title txt-cut" style="-webkit-line-clamp:2;"> 653 <div class="recommed_contant_title txt-cut" style="-webkit-line-clamp:2;">
632 {$vo.post_title} 654 {$vo.post_title}
633 </div> 655 </div>
634 - <div class="recommed_contant_money"> 656 + <div class="recommed_contant_money one-txt-cut">
635 ¥{$vo.price} 657 ¥{$vo.price}
636 </div> 658 </div>
637 </div> 659 </div>
@@ -685,13 +707,22 @@ @@ -685,13 +707,22 @@
685 </notempty> 707 </notempty>
686 </div> 708 </div>
687 <!--底部--> 709 <!--底部-->
688 - <include file="public@footer"/> 710 + <include file="public@footer" />
689 </body> 711 </body>
690 <script src="__TMPL__/public/assets/js/base.js"></script> 712 <script src="__TMPL__/public/assets/js/base.js"></script>
691 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script> 713 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
692 <script src="__TMPL__/public/assets/js/swiper.min.js"></script> 714 <script src="__TMPL__/public/assets/js/swiper.min.js"></script>
693 <script src="__TMPL__/public/assets/js/public.js"></script> 715 <script src="__TMPL__/public/assets/js/public.js"></script>
694 <script> 716 <script>
  717 + // 禁止下载
  718 + $('video').bind('contextmenu', function() {
  719 + return false;
  720 + });
  721 + var video2 = document.getElementById("video2"); //获取ID
  722 + function nos() {
  723 + $('.vi_maks').hide();
  724 + video2.pause();
  725 + }
695 // 翻转 726 // 翻转
696 $('.center_card_bg').each(function() { 727 $('.center_card_bg').each(function() {
697 $(this).mouseover(function() { 728 $(this).mouseover(function() {
@@ -704,9 +735,13 @@ @@ -704,9 +735,13 @@
704 }) 735 })
705 }) 736 })
706 737
  738 + // 关闭视频
  739 + $('.vi_Img').click(function() {
  740 + nos();
  741 + });
707 742
708 // 星球奇景 743 // 星球奇景
709 - $(".statr_one,.statr_two,.statr_three,.statr_four,.statr_five,.statr_six,.statr_seven").click(function() { 744 + $(".statr_one,.statr_two,.statr_three,.statr_four,.statr_five,.statr_six,.statr_seven,.statr_99").click(function() {
710 if ($(this).find("img").attr("src") == "__TMPL__/public/assets/images/cicon_05@2x.png") { 745 if ($(this).find("img").attr("src") == "__TMPL__/public/assets/images/cicon_05@2x.png") {
711 $(this).find("img").attr("src", "__TMPL__/public/assets/images/cicon_06@2x.png"); 746 $(this).find("img").attr("src", "__TMPL__/public/assets/images/cicon_06@2x.png");
712 $(this).find("span").addClass("state_africa"); 747 $(this).find("span").addClass("state_africa");
@@ -21,8 +21,9 @@ @@ -21,8 +21,9 @@
21 </head> 21 </head>
22 22
23 <body> 23 <body>
24 - <include file="public@header"/> 24 + <include file="public@header" />
25 <div class="mask"> 25 <div class="mask">
  26 + 123544655464
26 </div> 27 </div>
27 <!-- 视频 --> 28 <!-- 视频 -->
28 <div class="fourth_video"> 29 <div class="fourth_video">
@@ -103,13 +104,38 @@ @@ -103,13 +104,38 @@
103 </div> 104 </div>
104 </div> 105 </div>
105 106
106 - <include file="public@footer"/> 107 + <include file="public@footer" />
107 </body> 108 </body>
108 <script src="__TMPL__/public/assets/js/base.js"></script> 109 <script src="__TMPL__/public/assets/js/base.js"></script>
109 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script> 110 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
110 <script src="__TMPL__/public/assets/js/swiper.min.js"></script> 111 <script src="__TMPL__/public/assets/js/swiper.min.js"></script>
111 <script src="__TMPL__/public/assets/js/public.js"></script> 112 <script src="__TMPL__/public/assets/js/public.js"></script>
112 <script> 113 <script>
  114 + // 禁止下载
  115 + $('video').bind('contextmenu', function() {
  116 + return false;
  117 + });
  118 + //监听播放时间
  119 + var video = document.getElementById('video');
  120 + //使用事件监听方式捕捉事件
  121 + video.addEventListener("timeupdate", function() {
  122 + var timeDisplay;
  123 + //用秒数来显示当前播放进度
  124 + timeDisplay = Math.floor(video.currentTime);
  125 + console.log(Math.floor(video.currentTime));
  126 + video.addEventListener('play', function() {
  127 + video.currentTime = 0;
  128 + });
  129 + //当视频播放到 15s的时候做处理
  130 +
  131 + if (timeDisplay >= 5) {
  132 + video.addEventListener('play', function() {
  133 + video.currentTime = 0;
  134 + }),
  135 + $('.video_mask').show();
  136 + video.pause();
  137 + }
  138 + }, false);
113 // 星域秀场视频 139 // 星域秀场视频
114 var video = document.getElementById("video"); 140 var video = document.getElementById("video");
115 141
@@ -119,8 +145,8 @@ @@ -119,8 +145,8 @@
119 $(".fourth_video_start").hide(); 145 $(".fourth_video_start").hide();
120 $('.video_poster').css('z-index', '-1'); 146 $('.video_poster').css('z-index', '-1');
121 } 147 }
122 - // swiper  
123 148
  149 + // swiper
124 var swiper = new Swiper(".swiper-container", { 150 var swiper = new Swiper(".swiper-container", {
125 slidesPerView: 3, 151 slidesPerView: 3,
126 paginationClickable: true, 152 paginationClickable: true,
@@ -144,10 +170,10 @@ @@ -144,10 +170,10 @@
144 switch_video(0); 170 switch_video(0);
145 171
146 //点击切换 172 //点击切换
147 - $('.curren li').click(function(){ 173 + $('.curren li').click(function() {
148 var index = $(this).index(); 174 var index = $(this).index();
149 - $('.curren').children('li').find('.li_img').css('opacity','0.3');  
150 - $('.curren').children('li').find('.txt-cut').css('color','rgba(153, 153, 153, 1)'); 175 + $('.curren').children('li').find('.li_img').css('opacity', '0.3');
  176 + $('.curren').children('li').find('.txt-cut').css('color', 'rgba(153, 153, 153, 1)');
151 switch_video(index); 177 switch_video(index);
152 }); 178 });
153 $(".select ul li").click(function() { 179 $(".select ul li").click(function() {
@@ -162,25 +188,25 @@ @@ -162,25 +188,25 @@
162 }); 188 });
163 189
164 //切换视频 190 //切换视频
165 - function switch_video(index){ 191 + function switch_video(index) {
166 //视频路径 192 //视频路径
167 var li_index = $('.curren').children('li').eq(index); 193 var li_index = $('.curren').children('li').eq(index);
168 //选中颜色 194 //选中颜色
169 - li_index.find('.li_img').css('opacity','1');  
170 - li_index.find('.txt-cut').css('color','rgba(9, 255, 142, 1)'); 195 + li_index.find('.li_img').css('opacity', '1');
  196 + li_index.find('.txt-cut').css('color', 'rgba(9, 255, 142, 1)');
171 197
172 //视频 198 //视频
173 var oneVideo = li_index.children('.li_video').val(); 199 var oneVideo = li_index.children('.li_video').val();
174 - $('#video').attr('src',oneVideo); 200 + $('#video').attr('src', oneVideo);
175 201
176 // 视频封面图 202 // 视频封面图
177 var oneCover = li_index.find('.li_img').attr('src'); 203 var oneCover = li_index.find('.li_img').attr('src');
178 - $('.video_poster').attr('src',oneCover);  
179 -// $('.video_poster').css('z-index', '10'); 204 + $('.video_poster').attr('src', oneCover);
  205 + // $('.video_poster').css('z-index', '10');
180 206
181 $('.fourth_video_start').css({ 207 $('.fourth_video_start').css({
182 'z-index': "11", 208 'z-index': "11",
183 - "display":"block" 209 + "display": "block"
184 }); 210 });
185 211
186 //标题,国家,取景,上映时间 212 //标题,国家,取景,上映时间
@@ -2,13 +2,13 @@ @@ -2,13 +2,13 @@
2 <html lang="en"> 2 <html lang="en">
3 3
4 <head> 4 <head>
5 - <meta charset="UTF-8"/>  
6 - <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport"/>  
7 - <meta http-equiv="X-UA-Compatible" content="ie=edge"/>  
8 - <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/css/swiper-3.4.2.min.css"/>  
9 - <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/css/base.css"/>  
10 - <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/css/audio.css"/>  
11 - <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/css/index.css"/> 5 + <meta charset="UTF-8" />
  6 + <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
  7 + <meta http-equiv="X-UA-Compatible" content="ie=edge" />
  8 + <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/css/swiper-3.4.2.min.css" />
  9 + <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/css/base.css" />
  10 + <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/css/audio.css" />
  11 + <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/css/index.css" />
12 <title>星域秀场</title> 12 <title>星域秀场</title>
13 <style> 13 <style>
14 .fourth_video { 14 .fourth_video {
@@ -53,19 +53,13 @@ @@ -53,19 +53,13 @@
53 </head> 53 </head>
54 54
55 <body> 55 <body>
56 - <include file="public@header"/> 56 + <include file="public@header" />
57 <!-- 视频 --> 57 <!-- 视频 -->
58 <div class="fourth_video"> 58 <div class="fourth_video">
59 <div class="fourth_video_center"> 59 <div class="fourth_video_center">
60 <notempty name="res_xqyy"> 60 <notempty name="res_xqyy">
61 <div class="video_bg" style="background-color:black;"> 61 <div class="video_bg" style="background-color:black;">
62 - <video src="{:cmf_get_file_download_url($res_xqyy.video)}" id="video" width="100%" style="height: 3.4rem;"></video>  
63 - </div>  
64 - <div class="xiucImg">  
65 - <img src="__TMPL__/public/assets/images/cicon_35@2x.png" alt="">  
66 - </div>  
67 - <div class="fourth_video_start">  
68 - <img onclick="bofang()" src="__TMPL__/public/assets/images/aicon_30.png" alt="" /> 62 + <video src="{:cmf_get_file_download_url($res_xqyy.video)}" id="video" width="100%" style="height: 3.4rem;" autoplay="autoplay" controls controlslist="nodownload"></video>
69 </div> 63 </div>
70 </notempty> 64 </notempty>
71 </div> 65 </div>
@@ -259,8 +253,8 @@ @@ -259,8 +253,8 @@
259 <div class="fourth_log_top"> 253 <div class="fourth_log_top">
260 <img src="{:cmf_get_image_url($vo.index_thumbnail)}" alt="" /> 254 <img src="{:cmf_get_image_url($vo.index_thumbnail)}" alt="" />
261 </div> 255 </div>
262 - <div class="fourth_log_bottom">  
263 - <div class="fourth_log_one"> 256 + <div class="fourth_log_bottom" style="height:4.04rem;">
  257 + <div class="fourth_log_one txt-cut" style="-webkit-line-clamp: 2;">
264 {$vo.post_title} 258 {$vo.post_title}
265 </div> 259 </div>
266 <div class="fourth_log_two txt-cut" style="-webkit-line-clamp: 3;"> 260 <div class="fourth_log_two txt-cut" style="-webkit-line-clamp: 3;">
@@ -331,7 +325,7 @@ @@ -331,7 +325,7 @@
331 </a> 325 </a>
332 </div> 326 </div>
333 <!--底部--> 327 <!--底部-->
334 - <include file="public@footer"/> 328 + <include file="public@footer" />
335 </body> 329 </body>
336 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script> 330 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
337 <script src="__TMPL__/public/assets/js/base.js"></script> 331 <script src="__TMPL__/public/assets/js/base.js"></script>
@@ -353,14 +347,7 @@ @@ -353,14 +347,7 @@
353 } 347 }
354 348
355 // 星域秀场视频 349 // 星域秀场视频
356 - var video = document.getElementById("video");  
357 350
358 - function bofang() {  
359 - video.play();  
360 - $("#video").attr("controls", "controls");  
361 - $(".fourth_video_start").hide();  
362 - $('.xiucImg').hide();  
363 - }  
364 // swiper 351 // swiper
365 var swiper = new Swiper(".swiper-containerHua", { 352 var swiper = new Swiper(".swiper-containerHua", {
366 slidesPerView: 2.5, 353 slidesPerView: 2.5,
@@ -18,7 +18,7 @@ @@ -18,7 +18,7 @@
18 </head> 18 </head>
19 19
20 <body> 20 <body>
21 - <include file="public@header"/> 21 + <include file="public@header" />
22 <!-- banner --> 22 <!-- banner -->
23 <div class="first_top"> 23 <div class="first_top">
24 <div class="first_top_img"> 24 <div class="first_top_img">
@@ -56,9 +56,12 @@ @@ -56,9 +56,12 @@
56 <div class="thirteenth_log_top"> 56 <div class="thirteenth_log_top">
57 <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" /> 57 <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" />
58 </div> 58 </div>
59 - <div class="thirteenth_log_bottom"> 59 + <div style="padding:0.24rem 0.34rem;box-sizing:border-box;">
  60 + <div class="thirteenth_log_bottom txt-cut" style="-webkit-line-clamp:2;">
60 {$vo.post_title} 61 {$vo.post_title}
61 </div> 62 </div>
  63 + </div>
  64 +
62 </a> 65 </a>
63 </div> 66 </div>
64 </li> 67 </li>
@@ -95,7 +98,7 @@ @@ -95,7 +98,7 @@
95 <div class="thirteenth_log_center_one txt-cut" style="-webkit-line-clamp: 2;"> 98 <div class="thirteenth_log_center_one txt-cut" style="-webkit-line-clamp: 2;">
96 {$vo.post_title} 99 {$vo.post_title}
97 </div> 100 </div>
98 - <div class="thirteenth_log_bottom_one"> 101 + <div class="thirteenth_log_bottom_one one-txt-cut">
99 ¥{$vo.price} 102 ¥{$vo.price}
100 </div> 103 </div>
101 </a> 104 </a>
@@ -134,7 +137,7 @@ @@ -134,7 +137,7 @@
134 <div class="thirteenth_log_center_one txt-cut" style="-webkit-line-clamp: 2;"> 137 <div class="thirteenth_log_center_one txt-cut" style="-webkit-line-clamp: 2;">
135 {$vo.post_title} 138 {$vo.post_title}
136 </div> 139 </div>
137 - <div class="thirteenth_log_bottom_one"> 140 + <div class="thirteenth_log_bottom_one one-txt-cut">
138 ¥{$vo.price} 141 ¥{$vo.price}
139 </div> 142 </div>
140 </a> 143 </a>
@@ -219,7 +222,7 @@ @@ -219,7 +222,7 @@
219 </ul> 222 </ul>
220 </div> 223 </div>
221 </div> 224 </div>
222 - <include file="public@footer"/> 225 + <include file="public@footer" />
223 </body> 226 </body>
224 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script> 227 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
225 <script src="__TMPL__/public/assets/js/swiper.min.js"></script> 228 <script src="__TMPL__/public/assets/js/swiper.min.js"></script>
@@ -15,8 +15,8 @@ @@ -15,8 +15,8 @@
15 </head> 15 </head>
16 16
17 <body> 17 <body>
18 - <include file="public@header"/>  
19 - <include file="public@slide"/> 18 + <include file="public@header" />
  19 + <include file="public@slide" />
20 <div class="mask"> 20 <div class="mask">
21 </div> 21 </div>
22 <!-- 星球故事 --> 22 <!-- 星球故事 -->
@@ -65,8 +65,8 @@ @@ -65,8 +65,8 @@
65 </div> 65 </div>
66 66
67 <!--评论--> 67 <!--评论-->
68 - <include file="public@comment"/>  
69 - <include file="public@footer"/> 68 + <include file="public@comment" />
  69 + <include file="public@footer" />
70 </body> 70 </body>
71 <script src="__TMPL__/public/assets/js/base.js"></script> 71 <script src="__TMPL__/public/assets/js/base.js"></script>
72 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script> 72 <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
@@ -100,6 +100,10 @@ a:link, @@ -100,6 +100,10 @@ a:link,
100 a:active, 100 a:active,
101 a:visited, 101 a:visited,
102 a:hover { 102 a:hover {
  103 + text-decoration: none;
  104 + background: none;
  105 + -webkit-tap-highlight-color: white;
  106 + -webkit-tap-highlight-color: transparent;
103 background: none; 107 background: none;
104 -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 108 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
105 -webkit-tap-highlight-color: transparent; 109 -webkit-tap-highlight-color: transparent;
@@ -1214,7 +1218,7 @@ body { @@ -1214,7 +1218,7 @@ body {
1214 font-size: 0.26rem; 1218 font-size: 0.26rem;
1215 color: rgba(153, 153, 153, 1); 1219 color: rgba(153, 153, 153, 1);
1216 line-height: 0.4rem; 1220 line-height: 0.4rem;
1217 - margin:0.2rem 0; 1221 + margin: 0.2rem 0;
1218 } 1222 }
1219 1223
1220 .in_seaConList { 1224 .in_seaConList {
@@ -136,6 +136,7 @@ @@ -136,6 +136,7 @@
136 width: 100%; 136 width: 100%;
137 height: 0.6rem; 137 height: 0.6rem;
138 display: block; 138 display: block;
  139 + font-size: 0.24rem;
139 padding-left: 0.4rem; 140 padding-left: 0.4rem;
140 padding-right: 0.2rem; 141 padding-right: 0.2rem;
141 box-sizing: border-box; 142 box-sizing: border-box;
1 /*单行溢出*/ 1 /*单行溢出*/
2 -body{ 2 +
  3 +body {
3 overflow-x: hidden; 4 overflow-x: hidden;
4 font-family: "微软雅黑"; 5 font-family: "微软雅黑";
5 } 6 }
  7 +
6 .one-txt-cut { 8 .one-txt-cut {
7 overflow: hidden; 9 overflow: hidden;
8 white-space: nowrap; 10 white-space: nowrap;
@@ -28,6 +30,26 @@ body{ @@ -28,6 +30,26 @@ body{
28 width: 7.5rem; 30 width: 7.5rem;
29 } 31 }
30 32
  33 +.vi_maks .vi_video {
  34 + width: 80%;
  35 + position: absolute;
  36 + left: 50%;
  37 + top: 50%;
  38 + transform: translate(-50%, -50%);
  39 + -webkit-transform: translate(-50%, -50%);
  40 + -moz-transform: translate(-50%, -50%);
  41 + -ms-transform: translate(-50%, -50%);
  42 + -o-transform: translate(-50%, -50%);
  43 +}
  44 +
  45 +.vi_Img {
  46 + position: absolute;
  47 + top: -0.36rem;
  48 + right: -0.3rem;
  49 + width: 0.42rem;
  50 + height: 0.42rem;
  51 +}
  52 +
31 53
32 /* 首页轮播 */ 54 /* 首页轮播 */
33 55
@@ -36,8 +58,18 @@ body{ @@ -36,8 +58,18 @@ body{
36 position: relative; 58 position: relative;
37 } 59 }
38 60
39 -body{ 61 +body {}
  62 +
  63 +.vi_maks {
  64 + width: 100%;
  65 + height: 100%;
  66 + position: fixed;
  67 + top: 0;
  68 + z-index: 9999;
  69 + background-color: rgba(0, 0, 0, 0.3)
40 } 70 }
  71 +
  72 +
41 /* 地球 */ 73 /* 地球 */
42 74
43 .top_earth { 75 .top_earth {
@@ -409,19 +441,15 @@ body{ @@ -409,19 +441,15 @@ body{
409 } 441 }
410 442
411 .center_card_catant_one { 443 .center_card_catant_one {
412 - /* width: 1.78rem; */  
413 - /* height: 0.28rem; */  
414 - font-size: 0.3rem; 444 + font-size: 0.26rem;
415 font-family: PingFang-SC-Medium; 445 font-family: PingFang-SC-Medium;
416 font-weight: 500; 446 font-weight: 500;
417 color: rgba(26, 26, 26, 1); 447 color: rgba(26, 26, 26, 1);
418 - /* line-height: 0.46rem; */  
419 } 448 }
420 449
421 .center_card_catant_two { 450 .center_card_catant_two {
422 - /* width: 1.72rem; */  
423 - /* height: 0.3rem; */  
424 - font-size: 0.3rem; 451 + margin-top: 0.1rem;
  452 + font-size: 0.26rem;
425 font-family: PingFang-SC-Medium; 453 font-family: PingFang-SC-Medium;
426 font-weight: 500; 454 font-weight: 500;
427 color: rgba(26, 26, 26, 1); 455 color: rgba(26, 26, 26, 1);
@@ -640,9 +668,8 @@ body{ @@ -640,9 +668,8 @@ body{
640 } 668 }
641 669
642 .useraccount_career { 670 .useraccount_career {
  671 + width: 1rem;
643 margin-left: 0.32rem; 672 margin-left: 0.32rem;
644 - /* width: 2.3rem; */  
645 - /* height: 0.24rem; */  
646 font-size: 0.24rem; 673 font-size: 0.24rem;
647 font-family: PingFang-SC-Medium; 674 font-family: PingFang-SC-Medium;
648 font-weight: 500; 675 font-weight: 500;
@@ -670,7 +697,7 @@ body{ @@ -670,7 +697,7 @@ body{
670 697
671 .gallery { 698 .gallery {
672 overflow: hidden; 699 overflow: hidden;
673 - margin: 0 0 0 0.32rem; 700 + margin: 0 0.32rem 0 0.32rem;
674 box-sizing: border-box; 701 box-sizing: border-box;
675 background-image: url(../images/cicon_27@2x.png); 702 background-image: url(../images/cicon_27@2x.png);
676 background-size: cover; 703 background-size: cover;
@@ -753,6 +780,12 @@ body{ @@ -753,6 +780,12 @@ body{
753 height: 2.3rem; 780 height: 2.3rem;
754 } 781 }
755 782
  783 +.statr_99 {
  784 + position: absolute;
  785 + top: 0rem;
  786 + left: 2.3rem;
  787 +}
  788 +
756 .recommed_contant_title { 789 .recommed_contant_title {
757 /* width: 2.32rem; */ 790 /* width: 2.32rem; */
758 height: 0.76rem; 791 height: 0.76rem;
@@ -764,13 +797,10 @@ body{ @@ -764,13 +797,10 @@ body{
764 } 797 }
765 798
766 .recommed_contant_money { 799 .recommed_contant_money {
767 - /* width: 1.1rem; */  
768 - /* height: 0.25rem; */ 800 + margin-top: 0.14rem;
769 font-size: 0.32rem; 801 font-size: 0.32rem;
770 - font-family: PingFang-SC-Bold;  
771 font-weight: bold; 802 font-weight: bold;
772 color: rgba(0, 215, 116, 1); 803 color: rgba(0, 215, 116, 1);
773 - line-height: 0.74rem;  
774 } 804 }
775 805
776 806
@@ -838,6 +868,7 @@ body{ @@ -838,6 +868,7 @@ body{
838 /* 搜索 */ 868 /* 搜索 */
839 869
840 .first_search { 870 .first_search {
  871 + position: relative;
841 width: 3.16rem; 872 width: 3.16rem;
842 height: 0.6rem; 873 height: 0.6rem;
843 background: rgba(255, 255, 255, 1); 874 background: rgba(255, 255, 255, 1);
@@ -874,10 +905,9 @@ body{ @@ -874,10 +905,9 @@ body{
874 /* 亲临现场 */ 905 /* 亲临现场 */
875 906
876 .first_scene { 907 .first_scene {
877 - /*width: 7.5rem;*/  
878 - /* margin-top: 0.66rem;  
879 - margin-left: 0.32rem */  
880 - padding: 0.66rem 0.32rem 0.1rem 0.32rem; 908 + padding: 0.66rem 0 0.1rem 0;
  909 + margin: 0 0.32rem;
  910 + overflow: hidden;
881 box-sizing: border-box; 911 box-sizing: border-box;
882 } 912 }
883 913
@@ -922,27 +952,17 @@ body{ @@ -922,27 +952,17 @@ body{
922 952
923 /* 轮播图 */ 953 /* 轮播图 */
924 954
925 -.first_galley_contant {  
926 - width: 5rem;  
927 -}  
928 -  
929 .first_galley_contant_img img { 955 .first_galley_contant_img img {
930 width: 100%; 956 width: 100%;
931 - height: 5rem!important;  
932 -}  
933 -  
934 -.first_gallery .swiper-slide {  
935 - width: 5rem!important;  
936 - margin-right: 0.14rem!important 957 + height: 100%;
937 } 958 }
938 959
939 .first_galley_contant_title { 960 .first_galley_contant_title {
940 - padding: 0.34rem 0.44rem 0.26rem 0.30rem; 961 + padding: 0.34rem 0.44rem 0rem 0.30rem;
941 box-sizing: border-box; 962 box-sizing: border-box;
942 margin-top: -0.1rem; 963 margin-top: -0.1rem;
943 - height: 1.74rem; 964 + height: 1.86rem;
944 background: rgba(255, 255, 255, 1); 965 background: rgba(255, 255, 255, 1);
945 - margin-bottom: 0.30rem  
946 } 966 }
947 967
948 .first_galley_contant_title_top { 968 .first_galley_contant_title_top {
@@ -974,21 +994,12 @@ body{ @@ -974,21 +994,12 @@ body{
974 /* 市井漫游 */ 994 /* 市井漫游 */
975 995
976 .first_town .swiper-slide { 996 .first_town .swiper-slide {
977 - width: 6rem!important;  
978 - margin-right: 0.14rem!important;  
979 - background: #fff 997 + background: #fff;
980 } 998 }
981 999
982 .first_town .first_galley_contant_img { 1000 .first_town .first_galley_contant_img {
983 - padding: 0.25rem 0.25rem 0 0.25rem  
984 -}  
985 -  
986 -.first_town .first_galley_contant_img img {  
987 - width: 5.5rem!important  
988 -}  
989 -  
990 -.first_town .first_galley_contant {  
991 - width: 6rem; 1001 + padding: 0.24rem 0.24rem 0;
  1002 + box-sizing: border-box;
992 } 1003 }
993 1004
994 1005
@@ -1053,8 +1064,6 @@ body{ @@ -1053,8 +1064,6 @@ body{
1053 1064
1054 .second_paging .page { 1065 .second_paging .page {
1055 margin: 0.07rem; 1066 margin: 0.07rem;
1056 - /* width: 0.08rem; */  
1057 - /* height: 0.2rem; */  
1058 font-size: 0.26rem; 1067 font-size: 0.26rem;
1059 font-family: PingFang-SC-Medium; 1068 font-family: PingFang-SC-Medium;
1060 font-weight: 500; 1069 font-weight: 500;
@@ -1244,6 +1253,7 @@ body{ @@ -1244,6 +1253,7 @@ body{
1244 } 1253 }
1245 1254
1246 .fourth_log_one { 1255 .fourth_log_one {
  1256 + text-align: center;
1247 font-size: 0.3rem; 1257 font-size: 0.3rem;
1248 font-family: PingFang-SC-Medium; 1258 font-family: PingFang-SC-Medium;
1249 font-weight: 500; 1259 font-weight: 500;
@@ -2026,8 +2036,7 @@ body{ @@ -2026,8 +2036,7 @@ body{
2026 } 2036 }
2027 2037
2028 .thirteenth_log_bottom { 2038 .thirteenth_log_bottom {
2029 - width: 3.86rem;  
2030 - padding: 0.24rem 0.52rem 0.24rem 0.36rem; 2039 + padding: 0.06rem 0.06rem;
2031 box-sizing: border-box; 2040 box-sizing: border-box;
2032 font-size: 0.3rem; 2041 font-size: 0.3rem;
2033 font-family: PingFang-SC-Medium; 2042 font-family: PingFang-SC-Medium;
@@ -2053,6 +2062,7 @@ body{ @@ -2053,6 +2062,7 @@ body{
2053 .thirteenth_log_top_one { 2062 .thirteenth_log_top_one {
2054 width: 1.6rem; 2063 width: 1.6rem;
2055 height: 1.6rem; 2064 height: 1.6rem;
  2065 + margin: auto;
2056 } 2066 }
2057 2067
2058 .thirteenth_log_top_one img { 2068 .thirteenth_log_top_one img {
@@ -2062,19 +2072,20 @@ body{ @@ -2062,19 +2072,20 @@ body{
2062 2072
2063 .thirteenth_log_center_one { 2073 .thirteenth_log_center_one {
2064 font-size: 0.28rem; 2074 font-size: 0.28rem;
2065 - font-family: PingFang-SC-Medium;  
2066 - font-weight: 500; 2075 + height: 0.84rem;
  2076 + text-align: center;
2067 color: rgba(26, 26, 26, 1); 2077 color: rgba(26, 26, 26, 1);
2068 line-height: 0.42rem; 2078 line-height: 0.42rem;
2069 - margin-top: 0.46rem 2079 + margin-top: 0.42rem
2070 } 2080 }
2071 2081
2072 .thirteenth_log_bottom_one { 2082 .thirteenth_log_bottom_one {
2073 font-size: 0.32rem; 2083 font-size: 0.32rem;
2074 - font-family: PingFang-SC-Bold; 2084 + text-align: center;
2075 font-weight: bold; 2085 font-weight: bold;
2076 color: rgba(0, 215, 116, 1); 2086 color: rgba(0, 215, 116, 1);
2077 - margin-top: 0.28rem 2087 + margin-top: 0.2rem;
  2088 + line-height: 1;
2078 } 2089 }
2079 2090
2080 2091
@@ -2305,8 +2316,6 @@ body{ @@ -2305,8 +2316,6 @@ body{
2305 } 2316 }
2306 2317
2307 .index_eighteenth_top_two { 2318 .index_eighteenth_top_two {
2308 - display: flex;  
2309 - justify-content: flex-start;  
2310 padding: 0 0.20rem 0.30rem 0.22rem; 2319 padding: 0 0.20rem 0.30rem 0.22rem;
2311 box-sizing: border-box 2320 box-sizing: border-box
2312 } 2321 }
@@ -2573,12 +2582,13 @@ body{ @@ -2573,12 +2582,13 @@ body{
2573 2582
2574 .select ul { 2583 .select ul {
2575 overflow-y: scroll; 2584 overflow-y: scroll;
2576 - height: 2.6rem; 2585 + height: 2.3rem;
2577 display: none; 2586 display: none;
2578 position: absolute; 2587 position: absolute;
2579 width: 2.54rem; 2588 width: 2.54rem;
2580 z-index: 10; 2589 z-index: 10;
2581 left: 0.3rem; 2590 left: 0.3rem;
  2591 + top: 0.64rem;
2582 } 2592 }
2583 2593
2584 .select ul li { 2594 .select ul li {
@@ -15,7 +15,7 @@ video.addEventListener("timeupdate", function() { @@ -15,7 +15,7 @@ video.addEventListener("timeupdate", function() {
15 }); 15 });
16 //当视频播放到 15s的时候做处理 16 //当视频播放到 15s的时候做处理
17 17
18 - if (timeDisplay >= 5) { 18 + if (timeDisplay >= 20) {
19 video.addEventListener('play', function() { 19 video.addEventListener('play', function() {
20 video.currentTime = 0; 20 video.currentTime = 0;
21 }), 21 }),