<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <link rel="stylesheet" href="__TMPL__/public/assets/css/swiper-3.4.2.min.css" /> <link rel="stylesheet" href="__TMPL__/public/assets/css/base.css" /> <link rel="stylesheet" href="__TMPL__/public/assets/css/index.css" /> <script src="__TMPL__/public/assets/js/base.js"></script> <title>星享体验</title> <style> .first_search, .first_search_left { display: flex; display: -webkit-flex; align-items: center; } .first_search_left_img { width: 0.2rem; height: 0.22rem; } .first_search_right_img { width: 0.2rem; height: 0.2rem; } .first_search_right_img img { width: 100%; height: 100%; display: block; } .first_search_left_img img { width: 100%; height: 100%; display: block; } .first_searchUl { display: none; width: 2.6rem; height: 2.4rem; overflow-y: scroll; position: absolute; top: 0.6rem; left: 0.26rem; z-index: 100; } .first_searchUl li { background-color: white; padding: 0.1rem 0.18rem; box-sizing: border-box; border-top: 1px solid #D4DCEB; } </style> </head> <body> <include file="public@header" /> <!-- banner --> <div class="first_top"> <div class="first_top_img"> <volist name="coverImg" id="vo"> <img src="{:cmf_get_image_url($vo.image)}" alt=""> </volist> </div> <div class="first_top_title"> Star Experience </div> </div> <!-- 搜索栏 --> <div class="first_search"> <div class="first_search_left"> <div class="first_search_left_img"> <img src="__TMPL__/public/assets/images/cicon_06@2x.png" alt="" /> </div> <div class="first_search_left_word show_city">所有</div> </div> <div class="first_search_right"> <div class="first_search_right_img"> <img src="__TMPL__/public/assets/images/down2.png" alt="" /> </div> </div> <input type="hidden" value="{$cityName}" id="cityName"> <form method="GET" action="/portal/enjoy/index"> <ul class="first_searchUl"> <li value="0" class="one-txt-cut">所有</li> <volist name="city_name" id="vo"> <li value="{$vo.id}" class="one-txt-cut">{$vo.name}</li> </volist> </ul> <input type="hidden" value="0" name="city_id" id="city_id"> <div style="display:none;"> <input type="submit" id="city_submit"/> </div> </form> </div> <!-- 亲临现场 --> <div class="first_scene"> <div class="first_scene_contant" id="own"> <div class="first_scene_img"> <div class="first_scene_top_img"> <img src="__TMPL__/public/assets/images/cicon_50@2x.png" alt="" /> </div> <div class="first_scene_top_ch">亲临<span>现场</span> </div> <div class="first_scene_top_en">On Spot </div> </div> </div> <!-- 亲临现场 --> <div class="first_gallery"> <!-- 图片 --> <div class="star_gall_img swiper-container"> <!-- 轮播图 --> <ul class="swiper-wrapper"> <volist name="res_qlxc" id="vo"> <li class="swiper-slide"> <div class="first_galley_contant"> <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}"> <div class="first_galley_contant_img" style="height:5rem;"> <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" /> </div> <div class="first_galley_contant_title"> <div class="first_galley_contant_title_top one-txt-cut"> {$vo.post_title} </div> <div class="first_galley_contant_title_bottom txt-cut" style="-webkit-line-clamp: 2;"> {$vo.post_excerpt} </div> </div> </a> </div> </li> </volist> </ul> </div> </div> </div> <!-- 市井漫游 --> <div class="first_scene"> <div class="first_scene_contant" id="roam"> <div class="first_scene_img"> <div class="first_scene_top_img"> <img src="__TMPL__/public/assets/images/cicon_51@2x.png" alt="" /> </div> <div class="first_scene_top_ch">市井<span>漫游</span> </div> <div class="first_scene_top_en"> Local Walker </div> </div> </div> <!-- 市井漫游 --> <div class="first_gallery first_town"> <!-- 图片 --> <div class="star_gall_img swiper-container2"> <!-- 轮播图 --> <ul class="swiper-wrapper"> <volist name="res_sjmy" id="vo"> <li class="swiper-slide"> <div class="first_galley_contant"> <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}"> <div class="first_galley_contant_img" style="height:6rem;"> <img src="{:cmf_get_image_url($vo.index_thumbnail2)}" alt="" /> </div> <div class="first_galley_contant_title"> <div class="first_galley_contant_title_top one-txt-cut"> {$vo.post_title} </div> <div class="first_galley_contant_title_bottom txt-cut" style="-webkit-line-clamp: 2;"> {$vo.post_excerpt} </div> </div> </a> </div> </li> </volist> </ul> </div> </div> </div> <!-- 视听盛宴 --> <div class="first_scene"> <div class="first_scene_contant" id="feast"> <div class="first_scene_img"> <div class="first_scene_top_img"> <img src="__TMPL__/public/assets/images/cicon_52@2x.png" alt="" /> </div> <div class="first_scene_top_ch">视听<span>盛宴</span> </div> <div class="first_scene_top_en"> Sense Feast </div> </div> </div> <!-- 视听盛宴 --> <div class="first_gallery"> <!-- 图片 --> <div class="star_gall_img swiper-container"> <!-- 轮播图 --> <ul class="swiper-wrapper"> <volist name="res_stsy" id="vo"> <li class="swiper-slide"> <div class="first_galley_contant"> <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}"> <div class="first_galley_contant_img" style="height:5rem;"> <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" /> </div> <div class="first_galley_contant_title"> <div class="first_galley_contant_title_top one-txt-cut"> {$vo.post_title} </div> <div class="first_galley_contant_title_bottom txt-cut" style="-webkit-line-clamp: 2;"> {$vo.post_excerpt} </div> </div> </a> </div> </li> </volist> </ul> </div> </div> </div> <!-- 户外天堂 --> <div class="first_scene"> <div class="first_scene_contant" id="sky"> <div class="first_scene_img"> <div class="first_scene_top_img"> <img src="__TMPL__/public/assets/images/cicon_53@2x.png" alt="" /> </div> <div class="first_scene_top_ch">户外<span>天堂</span> </div> <div class="first_scene_top_en"> Outdoor & Sport </div> </div> </div> <!-- 户外天堂 --> <div class="first_gallery"> <!-- 图片 --> <div class="star_gall_img swiper-container"> <!-- 轮播图 --> <ul class="swiper-wrapper"> <volist name="res_hwtt" id="vo"> <li class="swiper-slide"> <div class="first_galley_contant"> <a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}"> <div class="first_galley_contant_img" style="height:5rem;"> <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" /> </div> <div class="first_galley_contant_title"> <div class="first_galley_contant_title_top one-txt-cut"> {$vo.post_title} </div> <div class="first_galley_contant_title_bottom"> {$vo.post_excerpt} </div> </div> </a> </div> </li> </volist> </ul> </div> </div> </div> <!--底部--> <include file="public@footer" /> </body> <script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script> <script src="__TMPL__/public/assets/js/swiper.min.js"></script> <script src="__TMPL__/public/assets/js/public.js"></script> <script> var value = $('#cityName').val(); if(value != ''){ $('.show_city').text(value); }else{ $('.show_city').text('所有'); } $('.first_search').click(function() { if ($('.first_search_right_img img').attr('src') == "__TMPL__/public/assets/images/down2.png") { $('.first_search_right_img img').attr('src', "__TMPL__/public/assets/images/upjian.png"); $('.first_searchUl').show(); } else { $('.first_search_right_img img').attr('src', "__TMPL__/public/assets/images/down2.png"); $('.first_searchUl').hide(); } }); $('.first_searchUl li').click(function() { var city_id = $(this).val(); $('#city_id').val(city_id); $('form').submit(); window.location.href = '/portal/enjoy/index?city_id='+city_id; }); // 星域秀场视频 var video = document.getElementById("video"); function bofang() { video.play(); $("#video").attr("controls", "controls"); $(".video_start").hide(); } // swiper var swiper = new Swiper(".swiper-container", { slidesPerView: 1.3, paginationClickable: true, spaceBetween: 10, freeMode: true }); var swiper = new Swiper('.swiper-container2', { slidesPerView: 1.1, paginationClickable: true, spaceBetween: 10, freeMode: true }); </script> </html>