作者 景龙
1 个管道 的构建 通过 耗费 1 秒

渲染星享体验等模块页面

... ... @@ -20,20 +20,25 @@ class EnjoyController extends HomeBaseController
private $more_limit = 8;//更多列表分页
public function index(){
//按照城市查询
$city_id = $this->request->param('city_id');
//默认澳大利亚
$city_id = $this->request->param('city_id',35,'intval');
$position['city_id'] = $city_id;
$this->assign('city_id',$city_id);
//城市分类
$city_name = $this->getCityName();
$this->assign('city_name',$city_name);
//亲临现场
$position['category_id'] = CityCategoryModel::qlxc;
$field = 'id,thumbnail,post_title,post_excerpt';
$res_qlxc = $this->getChildArticle($position,$field);
$res_qlxc = $this->getChildArticle($position,$field,$this->index_limit);
$this->assign('res_qlxc',$res_qlxc);
//市井漫游
$position['category_id'] = CityCategoryModel::yyzx;
$field = 'id,thumbnail,post_title,more';
$res_yyzx = $this->getChildArticle($position,$field);
foreach($res_yyzx as &$value){
$position['category_id'] = CityCategoryModel::sjmy;
$field = 'id,thumbnail,post_title,post_excerpt,more';
$res_sjmy = $this->getChildArticle($position,$field,$this->index_limit);
foreach($res_sjmy as &$value){
$more = json_decode($value['more'],true);
if(isset($more['photos']) && !empty($more['photos'])){
$value['photos'] = $more['photos'][0]['url'];
... ... @@ -41,7 +46,7 @@ class EnjoyController extends HomeBaseController
$value['photos'] = '';
}
}
$this->assign('res_yyzx',$res_yyzx);
$this->assign('res_sjmy',$res_sjmy);
//视听盛宴
$position['category_id'] = CityCategoryModel::stsy;
... ... @@ -92,5 +97,15 @@ class EnjoyController extends HomeBaseController
$res['image_url'] = isset($more['photos']) && !empty($more['photos'])?$more['photos']:'';
}
$this->assign('res',$res);
return $this->fetch(':enjoy_detail');
}
//获取城市名称
public function getCityName(){
$res = Db::name('city_category')
->where('pid','<>',0)
->where('delete_time',0)
->field('id,name')->select()->toArray();
return $res;
}
}
... ...
... ... @@ -21,25 +21,25 @@ class ScoutController extends HomeBaseController
//旅游路线
$position['category_id'] = CityCategoryModel::lylx;
$field = 'id,thumbnail,post_title';
$res_lylx = $this->getChildArticle($position,$field,1);
$res_lylx = $this->getChildArticle($position,$field,$this->index_limit);
$this->assign('res_lylx',$res_lylx);
//地道风物
$position['category_id'] = CityCategoryModel::ddfw;
$field = 'id,thumbnail,post_title,price';
$res_ddfw = $this->getChildArticle($position,$field);
$res_ddfw = $this->getChildArticle($position,$field,$this->index_limit);
$this->assign('res_ddfw',$res_ddfw);
//创意设计
$position['category_id'] = CityCategoryModel::cysj;
$field = 'id,thumbnail,post_title,price';
$res_cysj = $this->getChildArticle($position,$field);
$res_cysj = $this->getChildArticle($position,$field,$this->index_limit);
$this->assign('res_cysj',$res_cysj);
//悦己悦人
$position['category_id'] = CityCategoryModel::yjyr;
$field = 'id,thumbnail,post_title,price';
$res_yjyr = $this->getChildArticle($position,$field);
$res_yjyr = $this->getChildArticle($position,$field,$this->index_limit);
$this->assign('res_yjyr',$res_yjyr);
return $this->fetch();
... ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>星享体验</title>
<link rel="stylesheet" href="__TMPL__/public/assets/css/enjoyment.css">
<link rel="stylesheet" href="__TMPL__/public/assets/css/enjoyment_index.css">
<link rel="stylesheet" href="__TMPL__/public/assets/js/swiper4/swiper.min.css">
</head>
<body>
<include file="public@header"/>
<div class="banner">
<img src="__TMPL__/public/assets/starImg/bicon_31.png" alt="">
</div>
<main>
<div class="container">
<div class="region">
<select name="city_id">
<volist name="city_name" id="vo">
<option value="{$vo.id}" <eq name="$city_id" value="$city_id">selected</eq>>{$vo.name}</option>
</volist>
</select>
</div>
<!--亲临现场-->
<div class="Spot">
<div class="Spot_title clearfix">
<div class="Spot_icon fl">
<img src="__TMPL__/public/assets/starImg/aicon_61.png" alt="">
</div>
<div class="Spot_name fl">
<div class="Spot_name_left fl">
亲临
</div>
<div class="Spot_name_right fl">
现场
</div>
</div>
<div class="Spot_English_name fl">
<p>On Spot</p>
</div>
</div>
<div class="Spot_main">
<div class="swiper-container swiper-no-swiping">
<div class="swiper-wrapper">
<volist name="res_qlxc" id="vo">
<div class="swiper-slide">
<div class="Spot_item">
<a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}">
<div class="Spot_top"><img src="{:cmf_get_image_url($vo.thumbnail)}" alt=""></div>
<div class="Spot_bottom">
<div class="Spot_bottom_title">
{$vo.post_title}
</div>
<div class="Spot_bottom_main">
{$vo.post_excerpt}
</div>
</div>
</a>
</div>
</div>
</volist>
</div>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
</div>
<!--市井漫游-->
<div class="Walker">
<div class="Spot_title clearfix">
<div class="Spot_icon fl">
<img src="__TMPL__/public/assets/starImg/aicon_62.png" alt="">
</div>
<div class="Spot_name fl">
<div class="Spot_name_left fl">
市井
</div>
<div class="Spot_name_right fl">
漫游
</div>
</div>
<div class="Spot_English_name fl">
<p>Local Walker</p>
</div>
</div>
<div class="Walker_main">
<div class="swiper-container swiper-no-swiping">
<div class="swiper-wrapper">
<volist name="res_sjmy" id="vo">
<div class="swiper-slide">
<div class="Walker_item clearfix">
<a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}">
<div class="Walker_item_left fl">
<img src="{:cmf_get_image_url($vo.photos)}" alt="">
</div>
<div class="Walker_item_right fr">
<div class="Walker_item_right_top">
<div class="Walker_item_right_top_title">
{$vo.post_title}
</div>
<div class="Walker_item_right_top_main">
{$vo.post_excerpt}
</div>
</div>
<img src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
</div>
</a>
</div>
</div>
</volist>
</div>
</div>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
<!--视听盛宴-->
<div class="Feast">
<div class="Spot_title clearfix">
<div class="Spot_icon fl">
<img src="__TMPL__/public/assets/starImg/aicon_64.png" alt="">
</div>
<div class="Spot_name fl">
<div class="Spot_name_left fl">
视听
</div>
<div class="Spot_name_right fl">
盛宴
</div>
</div>
<div class="Spot_English_name fl">
<p>Sense Feast</p>
</div>
</div>
<div class="Feast_main">
<div class="swiper-container swiper-no-swiping">
<div class="swiper-wrapper">
<volist name="res_stsy" id="vo">
<div class="swiper-slide">
<div class="Feast_item">
<a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}">
<div class="Feast_item_img">
<img src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
</div>
<div class="Feast_item_bottom">
<div class="Feast_item_bottom_title">
{$vo.post_title}
</div>
<div class="Feast_item_bottom_text">
{$vo.post_excerpt}
</div>
</div>
</a>
</div>
</div>
</volist>
</div>
<!-- Add Pagination -->
<div class="swiper-pagination"></div>
</div>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
<!--户外天堂-->
<div class="Sport">
<div class="Spot_title clearfix">
<div class="Spot_icon fl">
<img src="__TMPL__/public/assets/starImg/aicon_65.png" alt="">
</div>
<div class="Spot_name fl">
<div class="Spot_name_left fl">
户外
</div>
<div class="Spot_name_right fl">
天堂
</div>
</div>
<div class="Spot_English_name fl">
<p>Outdoor & Sport</p>
</div>
</div>
<div class="Sport_main">
<div class="swiper-container swiper-no-swiping">
<div class="swiper-wrapper">
<volist name="res_hwtt" id="vo">
<div class="swiper-slide">
<div class="Spot_item">
<a href="/portal/enjoy/getEnjoyDetail?id={$vo.id}">
<div class="Spot_top main_top"><img src="{:cmf_get_image_url($vo.thumbnail)}" alt=""></div>
<div class="Spot_bottom">
<div class="Spot_bottom_title">
{$vo.post_title}
</div>
<div class="Spot_bottom_main main_left">
{$vo.post_excerpt}
</div>
</div>
</a>
</div>
</div>
</volist>
</div>
</div>
</div>
<!-- Add Arrows -->
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
</div>
</main>
<include file="public@footer"/>
<script src="__TMPL__/public/assets/js/jquery-3.2.1.min.js"></script>
<script src="__TMPL__/public/assets/js/swiper4/swiper.min.js"></script>
<script src="__TMPL__/public/assets/js/public.js"></script>
<script>
var swiper = new Swiper('.Spot_main .swiper-container', {
slidesPerView: 2,
spaceBetween: 50,
navigation: {
nextEl: '.Spot_main .swiper-button-next',
prevEl: '.Spot_main .swiper-button-prev',
},
});
var swipe = new Swiper('.Walker_main .swiper-container', {
navigation: {
nextEl: '.Walker .swiper-button-next',
prevEl: '.Walker .swiper-button-prev',
},
});
var swi = new Swiper('.Feast .swiper-container', {
slidesPerView: 3,
spaceBetween: 50,
navigation: {
nextEl: '.Feast .swiper-button-next',
prevEl: '.Feast .swiper-button-prev',
},
});
var sw = new Swiper('.Sport .swiper-container', {
slidesPerView: 2,
spaceBetween: 50,
navigation: {
nextEl: '.Sport .swiper-button-next',
prevEl: '.Sport .swiper-button-prev',
},
});
</script>
</body>
</html>
... ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>星享体验详情</title>
<link rel="stylesheet" href="__TMPL__/public/assets/css/enjoyment.css">
<link rel="stylesheet" href="__TMPL__/public/assets/js/swiper4/swiper.min.css">
<link rel="stylesheet" href="__TMPL__/public/assets/css/enjoyment_outdoors.css">
</head>
<body>
<include file="public@header"/>
<div class="banner">
<div class="container">
<notempty name="res.image_url">
<img src="{:cmf_get_image_url($res.image_url[0]['url'])}" alt="">
<else/>
<img src="__TMPL__/public/assets/starImg/aicon_80.png" alt="">
</notempty>
</div>
</div>
<main>
<div class="container">
<div class="outdoors">
<div class="outdoors_title clearfix">
<div class="outdoors_title_left fl">{$res.post_title}</div>
<div class="outdoors_title_right fr">{$res.create_time|date="Y-m-d",###}</div>
</div>
<div class="outdoors_text">
{$res.post_content}
</div>
<notempty name="res.image_url">
<div class="Wheel">
<div class="swiper-container gallery-top swiper-no-swiping">
<div class="swiper-wrapper">
<volist name="res.image_url" id="vo">
<div class="swiper-slide" style='background-image:url({:cmf_get_image_url($vo.url)})'></div>
</volist>
</div>
<!-- Add Arrows -->
<div class="swiper-button-next swiper-button-white"></div>
<div class="swiper-button-prev swiper-button-white"></div>
</div>
<div class="swiper-container gallery-thumbs">
<div class="swiper-wrapper">
<volist name="res.image_url" id="vo">
<div class="swiper-slide" style="background-image:url({:cmf_get_image_url($vo.url)})"></div>
</volist>
</div>
</div>
</div>
</notempty>
</div>
<!-- 评论 -->
<include file="public@comment"/>
</div>
</main>
<!-- 侧边栏 -->
<div class="sidebar">
<!-- 收藏 -->
<div class="collections">
<img src="__TMPL__/public/assets/starImg/bicon_02.png" alt="">
</div>
<!-- 喜欢 -->
<div class="likes">
<img src="__TMPL__/public/assets/starImg/bicon_03.png" alt="">
</div>
<!-- wx分享 -->
<div class="wx_go">
<img src="__TMPL__/public/assets/starImg/bicon_04.png" alt="">
<p>168</p>
</div>
<!-- wb分享 -->
<div class="wb_go">
<img src="__TMPL__/public/assets/starImg/bicon_05.png" alt="">
<p>168</p>
</div>
</div>
<include file="public@footer"/>
<script src="__TMPL__/public/assets/js/jquery-3.2.1.min.js"></script>
<script src="__TMPL__/public/assets/js/swiper4/swiper.min.js"></script>
<script src="__TMPL__/public/assets/js/public.js"></script>
<script>
var galleryThumbs = new Swiper('.gallery-thumbs', {
spaceBetween: 10,
slidesPerView: 4,
loop: true,
freeMode: true,
loopedSlides: 5, //looped slides should be the same
watchSlidesVisibility: true,
watchSlidesProgress: true,
});
var galleryTop = new Swiper('.gallery-top', {
spaceBetween: 10,
loop: true,
loopedSlides: 5, //looped slides should be the same
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
thumbs: {
swiper: galleryThumbs,
},
});
</script>
</body>
</html>
... ...
... ... @@ -671,26 +671,28 @@
</div>
</div>
<!-- 星际活动 -->
<div class="star_activity">
<!-- 标题 -->
<div class="star_title clearfix">
<notempty name="res_xjhd">
<div class="star_activity">
<!-- 标题 -->
<div class="star_title clearfix">
<span>
<p>星际<i>活动</i></p>
<p>PLANET ACTIVITY</p>
</span>
</div>
<!-- 内容 -->
<div class="star_activity_con">
<ul class="clearfix xjhd">
<volist name="res_xjhd" id="vo">
<li>
<img style="width:590px;height:590px;" src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
<p>{$vo.post_title}</p>
</li>
</volist>
</ul>
</div>
</div>
<!-- 内容 -->
<div class="star_activity_con">
<ul class="clearfix xjhd">
<volist name="res_xjhd" id="vo">
<li>
<img style="width:590px;height:590px;" src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
<p>{$vo.post_title}</p>
</li>
</volist>
</ul>
</div>
</div>
</notempty>
</div>
<include file="public@footer"/>
... ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>星探推荐</title>
<link rel="stylesheet" href="__TMPL__/public/assets/css/enjoyment.css">
<link rel="stylesheet" href="__TMPL__/public/assets/css/Scout_index.css">
<link rel="stylesheet" href="__TMPL__/public/assets/js/swiper4/swiper.min.css">
</head>
<body>
<include file="public@header"/>
<div class="banner">
<img src="__TMPL__/public/assets/starImg/bicon_01.png" alt="">
</div>
<main>
<div class="container">
<!--旅行路线-->
<div class="Product">
<div class="Spot_title clearfix">
<div class="Spot_icon fl">
<img src="__TMPL__/public/assets/starImg/aicon_74.png" alt="">
</div>
<div class="Spot_name fl">
<div class="Spot_name_left fl">
旅行
</div>
<div class="Spot_name_right fl">
路线
</div>
</div>
<div class="Spot_English_name fl">
<p>Travel Product</p>
</div>
</div>
<div class="Product_main">
<div class="swiper-container">
<div class="swiper-wrapper">
<volist name="res_lylx" id="vo">
<div class="swiper-slide">
<div class="Product_item">
<div class="Product_item_img">
<img src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
</div>
<div class="Product_item_Route">
{$vo.post_title}
</div>
</div>
</div>
</volist>
</div>
</div>
</div>
<div class="swiper-button-next swiper-button-white"></div>
<div class="swiper-button-prev swiper-button-white"></div>
</div>
<!--地道风物-->
<div class="Specialty">
<div class="Spot_title clearfix">
<div class="Spot_icon fl">
<img src="__TMPL__/public/assets/starImg/aicon_75.png" alt="">
</div>
<div class="Spot_name fl">
<div class="Spot_name_left fl">
地道
</div>
<div class="Spot_name_right fl">
风物
</div>
</div>
<div class="Spot_English_name fl">
<p>Local Specialty</p>
</div>
</div>
<div class="Specialty_main">
<div class="swiper-container swiper-no-swiping">
<div class="swiper-wrapper">
<volist name="res_ddfw" id="vo">
<div class="swiper-slide">
<div class="Specialty_item">
<div class="Specialty_item_img">
<img src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
</div>
<div class="Specialty_item_name">
{$vo.post_title}
</div>
<div class="Specialty_item_price">¥{$vo.price}</div>
</div>
</div>
</volist>
</div>
</div>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
<!--创意设计-->
<div class="Innovation">
<div class="Spot_title clearfix">
<div class="Spot_icon fl">
<img src="__TMPL__/public/assets/starImg/aicon_76.png" alt="">
</div>
<div class="Spot_name fl">
<div class="Spot_name_left fl">
创意
</div>
<div class="Spot_name_right fl">
设计
</div>
</div>
<div class="Spot_English_name fl">
<p>Innovation</p>
</div>
</div>
<div class="Innovation_main">
<div class="swiper-container swiper-no-swiping">
<div class="swiper-wrapper">
<volist name="res_cysj" id="vo">
<div class="swiper-slide">
<div class="Specialty_item">
<div class="Specialty_item_img">
<img src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
</div>
<div class="Specialty_item_name">
{$vo.post_title}
</div>
<div class="Specialty_item_price">¥{$vo.price}</div>
</div>
</div>
</volist>
</div>
</div>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
<!--悦己悦人-->
<div class="Lifestyle">
<div class="Spot_title clearfix">
<div class="Spot_icon fl">
<img src="__TMPL__/public/assets/starImg/aicon_77.png" alt="">
</div>
<div class="Spot_name fl">
<div class="Spot_name_left fl">
悦己
</div>
<div class="Spot_name_right fl">
悦人
</div>
</div>
<div class="Spot_English_name fl">
<p>Lifestyle</p>
</div>
</div>
<div class="Lifestyle_main">
<div class="swiper-container">
<div class="swiper-wrapper">
<volist name="res_yjyr" id="vo">
<div class="swiper-slide">
<div class="Lifestyle_item">
<div class="Lifestyle_item_img">
<img src="{:cmf_get_image_url($vo.thumbnail)}" alt="">
</div>
<div class="Lifestyle_item_name">
{$vo.post_title}
</div>
<div class="Lifestyle_item_price">¥{$vo.price}</div>
</div>
</div>
</volist>
</div>
</div>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
</div>
</main>
<include file="public@footer"/>
<script src="__TMPL__/public/assets/js/jquery-3.2.1.min.js"></script>
<script src="__TMPL__/public/assets/js/swiper4/swiper.min.js"></script>
<script src="__TMPL__/public/assets/js/public.js"></script>
<script>
var swiper = new Swiper('.Product .swiper-container', {
slidesPerView: 3,
spaceBetween: 4,
navigation: {
nextEl: '.Product .swiper-button-next',
prevEl: '.Product .swiper-button-prev',
},
});
var swipe = new Swiper('.Specialty .swiper-container', {
slidesPerView: 'auto',
spaceBetween: 13,
navigation: {
nextEl: '.Specialty .swiper-button-next',
prevEl: '.Specialty .swiper-button-prev',
},
});
var swipe = new Swiper('.Innovation .swiper-container', {
slidesPerView: 'auto',
spaceBetween: 13,
navigation: {
nextEl: '.Innovation .swiper-button-next',
prevEl: '.Innovation .swiper-button-prev',
},
});
var swip = new Swiper('.Lifestyle .swiper-container', {
slidesPerView: 2,
spaceBetween: 16,
navigation: {
nextEl: '.Lifestyle .swiper-button-next',
prevEl: '.Lifestyle .swiper-button-prev',
},
});
</script>
</body>
</html>
... ...
.banner img {
width: 100%;
height: 666px;
}
main {
padding-top: 142px;
padding-bottom: 100px;
box-sizing: border-box;
}
.Product {
position: relative;
}
.Spot_title {
display: table;
margin-bottom: 40px;
}
.Spot_icon {
position: relative;
width: 52px;
height: 59px;
}
.Spot_icon img {
position: absolute;
line-height: 52px;
top: 0;
bottom: 0;
margin: auto 0;
}
.Spot_name {
font-size: 40px;
}
.Spot_name_left {
color: #fff;
}
.Spot_name_right {
float: right;
color: #09FF8E
}
.Spot_English_name {
width: 300px;
margin-left: 20px;
height: 52px;
font-size: 20px;
color: #fff;
position: relative;
}
.Spot_English_name p {
position: absolute;
bottom: 0;
}
.Product_item {
width: 386px;
}
.Product_item_img img {
width: 386px;
height: 303px;
}
.Specialty_item_name{
text-align:center;
}
.Product_item_Route {
box-sizing: border-box;
padding: 18px 34px;
background: #fff;
text-align:center;
}
.swiper-button-next, .swiper-button-prev {
width: 34px !important;
height: 34px !important;
background-size: cover !important;
top: inherit !important;
bottom: 20px !important;
}
.swiper-button-next {
background-image: url(../starImg/aicon_07.png) !important;
}
.swiper-button-prev {
background-image: url(../starImg/aicon_08.png) !important;
}
.swiper-button-prev.swiper-button-disabled {
background-image: url(../starImg/aicon_10.png) !important;
/* opacity: 1 !important; */
}
.swiper-button-next.swiper-button-disabled {
background-image: url(../starImg/aicon_09.png) !important;
/* opacity: 1 !important; */
}
.swiper-button-prev {
right: 70px !important;
bottom: inherit !important;
top: 40px !important;
left: inherit !important;
}
.swiper-button-next{
top: 40px !important;
left: inherit !important;
right: 10px !important;
}
.Specialty{
margin-top: 125px;
position: relative;
}
.Specialty .swiper-container,.Innovation .swiper-container{
height: 380px;
}
.Specialty_main .swiper-slide,.Innovation_main .swiper-slide{
width: 290px !important;
background: #fff;
}
.Specialty_main .swiper-slide:nth-child(3n+1),.Innovation_main .swiper-slide:nth-child(3n){
width: 593px !important;
}
.Innovation_main .swiper-slide:nth-child(3n) .Specialty_item_name{
text-align: center;
}
.Specialty_main .swiper-slide .Specialty_item,.Innovation_main .swiper-slide .Specialty_item{
width: 237px;
margin: 0 auto;
box-sizing: border-box;
padding-top: 32px;
}
.Specialty_main .swiper-slide .Specialty_item .Specialty_item_img,.Innovation_main .swiper-slide .Specialty_item .Specialty_item_img{
width: 230px;
height: 230px;
padding-top: 45px;
box-sizing: border-box;
}
.Specialty_main .swiper-slide.swiper-slide-active .Specialty_item,.Innovation_main .swiper-slide .Specialty_item{
width: 230px;
margin: 0 auto;
box-sizing: border-box;
padding-top: 32px;
}
.Specialty_main .swiper-slide.swiper-slide-active .Specialty_item .Specialty_item_img,.Innovation_main .swiper-slide .Specialty_item .Specialty_item_img{
width: 230px;
height: 230px;
padding-top: 45px;
box-sizing: border-box;
}
.Specialty_main .swiper-slide .Specialty_item .Specialty_item_img img,.Innovation_main .swiper-slide .Specialty_item .Specialty_item_img img{
display: block;
width: 160px;
height: 160px;
margin: 0 auto;
}
.Specialty_main .swiper-slide.swiper-slide-active .Specialty_item .Specialty_item_img img{
display: block;
width: 160px;
height: 160px;
margin: 0 auto;
}
.Specialty_main .swiper-slide .Specialty_item .Specialty_item_name{
margin-top: 16px;
text-align:center;
}
.Specialty_main .swiper-slide:nth-child(3n+1) .Specialty_item .Specialty_item_name{
text-align: center;
margin-top: 16px;
}
.Specialty_item .Specialty_item_price{
text-align: center;
margin-top: 24px;
font-size: 16px;
color: #00D774;
}
.Innovation,.Lifestyle{
margin-top: 106px;
position: relative;
}
.Lifestyle_main .swiper-container {
height: 380px;
}
.Lifestyle_main .swiper-container .swiper-slide{
background: #fff;
box-sizing: border-box;
}
.Lifestyle_main .swiper-slide .Lifestyle_item{
width: 230px;
margin: 0 auto;
box-sizing: border-box;
padding-top: 45px;
}
.Lifestyle_main .swiper-slide .Lifestyle_item .Lifestyle_item_img{
width: 230px;
height: 230px;
margin: 0 auto;
}
.Lifestyle_main .swiper-slide .Lifestyle_item .Lifestyle_item_img img{
max-width: 230px;
max-height: 230px;
margin: 0 auto;
display: block;
}
.Lifestyle_main .swiper-slide .Lifestyle_item .Lifestyle_item_name{
text-align: center;
font-size: 16px;
color: #1A1A1A;
margin-top: 8px;
}
.Lifestyle_main .swiper-slide .Lifestyle_item .Lifestyle_item_price{
text-align: center;
font-size: 16px;
color: #00D774;
margin-top: 24px;
}
\ No newline at end of file
... ...
body,
ol,
ul,
h1,
h2,
h3,
h4,
h5,
h6,
p,
th,
td,
dl,
dd,
form,
fieldset,
legend,
input,
textarea,
select {
margin: 0;
padding: 0
}
body {
font: 12px "微软雅黑", "MicrosoftYaHei", HELVETICA;
background: #fff;
-webkit-text-size-adjust: 100%;
}
.container {
width: 1200px;
margin: 0 auto;
}
.fl {
float: left;
}
.fr {
float: right;
}
a {
color: #2d374b;
text-decoration: none
}
em,
i {
font-style: normal
}
li {
list-style: none
}
img {
border: 0;
vertical-align: middle
}
table {
border-collapse: collapse;
border-spacing: 0
}
p {
word-wrap: break-word
}
body {
background: #3C3C94;
}
/*清除浮动*/
.clearfix::after {
content: ".";
clear: both;
display: block;
overflow: hidden;
font-size: 0;
height: 0;
}
.clearfix {
zoom: 1;
}
.show_main2 textarea {
width: 100%;
height: 120px;
padding: 24px;
border: 0;
resize: none;
margin-top: 40px;
box-sizing: border-box;
background: rgba(255, 255, 255, 1);
}
.show_main2_bottom {
line-height: 40px;
margin-top: 20px;
}
.show_main2_bottom p {
float: left;
font-size: 14px;
color: rgba(255, 255, 255, 1);
}
.show_main2_btn {
float: right;
width: 111px;
height: 42px;
border: 0;
cursor: pointer;
background: rgba(9, 255, 142, 1);
border-radius: 21px;
font-size: 20px;
color: rgba(26, 26, 26, 1);
line-height: 42px;
text-align: center;
}
.layui-laypage a,
.layui-laypage span {
margin-right: 6px;
}
.show_main2_show_H {
height: 352px;
overflow: hidden;
}
.show_main2_show {
width: 100%;
background-color: white;
margin-top: 40px;
padding: 30px;
box-sizing: border-box;
margin-bottom: 100px;
}
.show_comments_icon {
width: 44px;
float: left;
}
.show_main2_show ul li {
margin: 0 30px 30px;
cursor: pointer;
padding-bottom: 30px;
box-sizing: border-box;
border-bottom: 1px solid #EBEBEB;
}
.show_comments_con {
float: left;
width: 1000px;
margin-left: 24px;
}
.show_comments_con h1 {
font-size: 18px;
font-weight: bold;
color: rgba(62, 228, 152, 1);
}
.show_comments_con h2 {
font-size: 16px;
font-weight: 400;
line-height: 24px;
margin-top: 4px;
color: rgba(102, 102, 102, 1);
}
.show_comments_con p {
font-size: 14px;
margin-top: 20px;
color: rgba(153, 153, 153, 1);
}
.show_main_more {
cursor: pointer;
text-align: center;
font-size: 18px;
color: rgba(62, 228, 152, 1);
}
.show_main2 {
width: 1200px;
margin: auto;
}
/* 侧边栏 */
.sidebar {
position: fixed;
top: 200px;
right: 206px;
}
.collections,
.likes {
width: 60px;
padding: 15px 0;
background: rgba(84, 84, 175, 1);
border-radius: 4px;
margin-bottom: 10px;
}
.collections img,
.likes img,
.wx_go img,
.wb_go img {
width: 30px;
display: block;
margin: auto;
}
.wx_go {
width: 60px;
padding: 10px 0;
margin-bottom: 10px;
background: rgba(51, 194, 82, 1);
border-radius: 4px;
}
.wb_go {
width: 60px;
padding: 10px 0;
background: rgba(253, 99, 73, 1);
border-radius: 4px;
}
.wx_go p,
.wb_go p {
text-align: center;
font-size: 16px;
color: rgba(255, 255, 255, 1);
}
... ...
.banner {
height: 666px;
}
main {
padding-bottom: 100px;
}
.banner img {
width: 100%;
height: 666px;
}
.region {
padding-top: 47px;
padding-bottom: 60px;
}
.region select {
width: 316px;
height: 60px;
outline: none;
box-sizing: border-box;
padding-left: 30px;
border-radius: 30px;
}
.Spot_title {
display: table;
margin-bottom: 40px;
}
.Spot_icon {
position: relative;
width: 52px;
height: 59px;
}
.Spot_icon img {
position: absolute;
line-height: 52px;
top: 0;
bottom: 0;
margin: auto 0;
}
.Spot_name {
font-size: 40px;
}
.Spot_name_left {
color: #fff;
}
.Spot_name_right {
float: right;
color: #09FF8E
}
.Spot_English_name {
width: 300px;
margin-left: 20px;
height: 52px;
font-size: 20px;
color: #fff;
position: relative;
}
.Spot_English_name p {
position: absolute;
bottom: 0;
}
.Spot_main {
position: relative;
}
.Spot_main .swiper-container {
height: 780px !important;
}
.Spot_main .swiper-slide-active .Spot_item,
.Spot_main .swiper-slide-active {
width: 500px !important;
}
.Spot_main .swiper-slide-active .Spot_top img {
width: 500px;
height: 500px;
}
.Spot_main .swiper-slide-next .Spot_item,
.Spot_main .swiper-slide-next {
width: 648px !important;
}
.Spot_main .swiper-slide-next .Spot_top img {
width: 648px;
height: 648px;
}
.Spot_bottom {
background: #fff;
padding: 0 25px;
padding-bottom: 30px;
box-sizing: border-box;
}
.Spot_bottom_title {
padding: 18px 0;
font-size: 16px;
}
.swiper-slide-active .Spot_bottom_main {
font-size: 14px;
color: #999;
height:40px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.swiper-slide-next .Spot_bottom_main {
font-size: 14px;
color: #999;
height:60px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.swiper-button-next,
.swiper-button-prev {
width: 34px !important;
height: 34px !important;
background-size: cover !important;
top: inherit !important;
bottom: 20px !important;
}
.swiper-button-prev {
background-image: url(../starImg/aicon_08.png) !important;
}
.swiper-button-prev.swiper-button-disabled {
background-image: url(../starImg/aicon_10.png) !important;
/* opacity: 1 !important;*/
}
.swiper-button-next.swiper-button-disabled {
background-image: url(../starImg/aicon_09.png) !important;
/* opacity: 1 !important;*/
}
.swiper-button-next {
background-image: url(../starImg/aicon_07.png) !important;
right: inherit !important;
left: 70px !important;
}
.Walker {
margin-top: 80px;
position: relative;
}
.Walker_item {
width: 1200px;
padding: 40px;
box-sizing: border-box;
background: #fff;
}
.Walker_item_left img {
width: 600px;
height: 600px;
}
.Walker_item_right {
width: 480px;
}
.Walker_item_right img {
width: 480px;
height: 480px;
margin-top: 20px;
}
.Walker_item_right_top_title {
margin-top: 9px;
margin-bottom: 16px;
font-weight: 600;
font-size: 13px;
}
.Walker_item_right_top_main {
font-size: 14px;
color: #999;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.Walker_main {
position: relative;
}
.Walker_main .swiper-slide,
.Walker_main .swiper-container {
height: 680px !important;
}
.Walker .swiper-button-next,
.Walker .swiper-button-prev,
.Feast .swiper-button-next,
.Feast .swiper-button-prev {
bottom: inherit !important;
top: 40px !important;
left: inherit !important;
}
.Walker .swiper-button-next,
.Feast .swiper-button-next {
right: 10px !important;
}
.Walker .swiper-button-prev,
.Feast .swiper-button-prev {
right: 70px !important;
}
.Feast_item {
width: 380px;
}
.Feast {
margin-top: 125px;
position: relative;
}
.Feast_main {
height: 566px;
}
.Feast_item_img img {
width: 380px;
height: 380px;
}
.Feast_item_bottom {
padding: 22px;
background: #fff;
}
.Feast_item_bottom_title {
font-size: 16px;
color: #1A1A1A;
}
.Feast_item_bottom_text {
margin-top: 16px;
font-size: 14px;
color: #999;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.Feast .Feast_main .swiper-wrapper .swiper-slide {
position: relative;
top: 66px !important;
}
.Feast .Feast_main .swiper-wrapper .swiper-slide-active,
.Feast .Feast_main .swiper-wrapper .swiper-slide-prev {
position: relative !important;
top: 0px !important;
}
.Feast .Feast_main .swiper-wrapper .swiper-slide-next {
position: relative;
top: 42px !important;
}
.swiper-container {
height: 566px;
}
.Sport {
margin-top: 110px;
position: relative;
}
.Sport .swiper-container,
.Sport .swiper-slide-active,
.Sport .swiper-slide-active .Spot_item,.swiper-slide-prev,.swiper-slide-prev .Spot_item{
height: 780px !important;
}
.Sport .swiper-slide-active,
.Sport .swiper-slide-active .Spot_item,
.Sport .swiper-slide-active .Spot_item .Spot_top img {
width: 648px !important;
height:648px;
}
/*.swiper-slide-prev .Spot_item .Spot_top img{*/
/*width: 648px;*/
/*height: 648px;*/
/*}*/
.Sport .swiper-slide-next,
.Sport .swiper-slide-next .Spot_item {
width: 500px !important;
}
.Sport .swiper-slide-next .Spot_item .Spot_top img {
width: 500px !important;
height:500px;
}
.Sport .swiper-button-next,
.Sport .swiper-button-prev {
left: inherit !important;
}
.Sport .swiper-button-next {
right: 10px !important;
}
.Sport .swiper-button-prev {
right: 70px !important;
}
... ...
.banner {
padding-top: 78px;
}
.banner img {
display: block;
width: 100%;
height: 500px;
}
.outdoors {
width: 100%;
background: #fff;
padding: 50px;
box-sizing: border-box;
}
.outdoors_title {
margin-bottom: 40px;
}
.outdoors_title_left {
font-size: 32px;
color: #1A1A1A;
font-weight: bold;
}
.outdoors_title_right {
font-size: 22px;
color: #666666;
}
.outdoors_text p {
font-size: 16px;
line-height: 2;
margin-bottom: 20px;
color: #666;
}
.outdoors_img {
margin: 40px 0;
}
.outdoors_img img {
display: block;
width: 100%;
}
.swiper-container {
width: 100%;
height: 458px;
margin-left: auto;
margin-right: auto;
}
.swiper-slide {
background-size: cover;
background-position: center;
}
.gallery-thumbs {
height: 109px;
box-sizing: border-box;
padding: 10px 0;
}
.gallery-thumbs .swiper-slide {
height: 100%;
opacity: 0.4;
}
.gallery-thumbs .swiper-slide-thumb-active {
opacity: 1;
}
.swiper-button-prev {
background-image: url(../starImg/aicon_08.png) !important;
}
.swiper-button-prev.swiper-button-disabled {
background-image: url(../starImg/aicon_10.png) !important;
/* opacity: 1 !important;*/
}
.swiper-button-next.swiper-button-disabled {
background-image: url(../starImg/aicon_09.png) !important;
/* opacity: 1 !important;*/
}
.swiper-button-next {
background-image: url(../starImg/aicon_07.png) !important;
}
.swiper-button-next, .swiper-button-prev{
width: 34px !important;
height: 34px !important;
background-size: cover !important
}
\ No newline at end of file
... ...
... ... @@ -815,6 +815,7 @@ p {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-align:center;
}
.scout_box p {
... ...
... ... @@ -31,6 +31,9 @@
</div>
</li>
</volist>
<li class="slide_vo">
<a class="home_nav_act_A" href="javascript:void(0);">星际活动</a>
</li>
</ul>
</section>
<!-- 搜索框 -->
... ...
... ... @@ -307,7 +307,7 @@ hello;
//获取导航栏相关内容
public function getHeader(){
$parent = Db::name('portal_category')
->whereIn('id',[2,3,4,5])
->whereIn('id',[2,3,4])
->field('id,name,description url')
->select()
->toArray();
... ...