作者 jinglong
1 个管道 的构建 通过 耗费 8 秒

渲染详情页

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html;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" type="text/css" href="__TMPL__/public/assets/swiper3/swiper.min.css" />
<link rel="stylesheet" href="__TMPL__/public/assets/css/happy.css" />
<link rel="stylesheet" href="__TMPL__/public/assets/css/mask.css" />
<title>星享体验详情</title>
</head>
<body>
<include file="public@header"/>
<div class="mask">
</div>
<include file="public@slide"/>
<div class="happy_foreignBox2">
<!--banner-->
<div class="hp_forImg">
<notempty name="res.image_url">
<img src="{:cmf_get_image_url($res.image_url[0]['url'])}" alt="">
</notempty>
</div>
<!--内容-->
<div class="hp_forCon">
<h1 class="hp_forConTitle">{$res.post_title}</h1>
<span class="hp_forConTime"></span>
<!--富文本-->
<div class="hp_forConText">
<div class="hp_forConTime" style="color:#333;">{$res.post_content}</div>
<!--轮播-->
<div class="hp_fwb swiper-container">
<div class="swiper-wrapper">
<!--循环列表-->
<volist name="res.image_url" id="vo" offset="1">
<div class="swiper-slide">
<img class="fwb_Img" src="{:cmf_get_image_url($vo.url)}" />
<p class="fwb_Txt one-txt-cut">{$res.post_title}</p>
</div>
</volist>
</div>
<div class="swiper-pagination"></div>
</div>
</div>
</div>
</div>
<!--评论-->
<include file="public@comment"/>
<include file="public@footer"/>
<script src="__TMPL__/public/assets/js/base.js"></script>
<script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
<script src="__TMPL__/public/assets/swiper3/swiper.min.js"></script>
<script src="__TMPL__/public/assets/js/public.js"></script>
<script type="text/javascript">
//banner
var swiper = new Swiper('.swiper-container', {
pagination: '.swiper-pagination',
paginationClickable: true,
centeredSlides: true,
loop: true,
autoplayDisableOnInteraction: false
});
</script>
</body>
</html>
\ No newline at end of file
... ...
<!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" />
<link rel="stylesheet" href="__TMPL__/public/assets/css/mask.css" />
<link rel="stylesheet" href="__TMPL__/public/assets/css/happy.css" />
<title>公益未来详情</title>
</head>
<body>
<include file="public@header"/>
<include file="public@slide"/>
<div class="mask">
</div>
<!-- banner -->
<div class="index_eight_top">
<div class="index_eight_banner">
<img src="{:cmf_get_image_url($res.image_url)}" alt="" />
</div>
</div>
<!-- 详情 -->
<div class="index_eight_detail">
<div class="index_eight_detail_contant">
<div class="index_eight_detail_one">
{$res.post_title}
</div>
<div class="index_eight_detail_two">
<!--2019-02-04-->
</div>
<div class="index_eight_detail_three">
{$res.post_content}
</div>
</div>
</div>
<!--评论-->
<include file="public@comment"/>
<include file="public@footer"/>
</body>
<script src="__TMPL__/public/assets/js/base.js"></script>
<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></script>
</html>
\ No newline at end of file
... ...
<!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" />
<title>星域画廊详情</title>
<style>
body,
html {
width: 100%;
height: 100%;
}
.index_fourth .swiper-pagination-bullet-active {
background: #09FF8E;
}
.swiper-pagination-bullet {
background-color: white;
opacity: 1;
}
.index_shans {
-webkit-animation: bounce-down 1.8s linear infinite;
animation: bounce-down 1.8s linear infinite;
}
@keyframes bounce-down {
25% {
transform: translateY(-4px);
}
50%,
100% {
transform: translateY(0);
}
75% {
transform: translateY(4px);
}
}
</style>
</head>
<body>
<div class="index_fourth swiper-container">
<ul class="swiper-wrapper">
<volist name="res['image_url']" id="vo">
<li class="swiper-slide">
<img src="{:cmf_get_image_url($vo.url)}" alt="" />
<div class="index_fourth_top index_shans">
<div class="index_fourth_top_img">
<img src="__TMPL__/public/assets/images/cicon_102@2x.png" alt="" />
</div>
</div>
<div class="index_fourth_bottom">
<div class="index_fourth_bottom_cantant">
{$res.post_title}
</div>
</div>
</li>
</volist>
</ul>
<!--<div class="swiper-pagination"></div>-->
</div>
</body>
<script src="__TMPL__/public/assets/js/base.js"></script>
<script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
<script src="__TMPL__/public/assets/js/swiper.min.js"></script>
<script>
var swiper = new Swiper('.swiper-container', {
pagination: '.swiper-pagination',
paginationClickable: true,
direction: 'vertical',
onSlideChangeEnd: function(swiper) {
var snum = $('.index_fourth ul li').length;
console.log(swiper.activeIndex)
if (snum - 1 == swiper.activeIndex) {
$('.index_fourth_top').removeClass('index_shans');
} else {
$('.index_fourth_top').addClass('index_shans');
}
}
});
</script>
</html>
\ No newline at end of file
... ...
<!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" />
<link rel="stylesheet" href="__TMPL__/public/assets/css/mask.css" />
<link rel="stylesheet" href="__TMPL__/public/assets/css/happy.css" />
<title>独角快报详情</title>
</head>
<body>
<include file="public@header"/>
<include file="public@slide"/>
<div class="mask">
</div>
<!-- banner -->
<!--<div class="index_eight_top">-->
<!--<div class="index_eight_banner">-->
<!--<img src="{:cmf_get_image_url($res.image_url)}" alt="" />-->
<!--</div>-->
<!--</div>-->
<!-- 详情 -->
<div class="index_eight_detail">
<div class="index_eight_detail_contant">
<div class="index_eight_detail_one">
{$res.post_title}
</div>
<div class="index_eight_detail_two">
<!--2019-02-04-->
</div>
<div class="index_eight_detail_three">
{$res.post_content}
</div>
</div>
</div>
<!--评论-->
<include file="public@comment"/>
<include file="public@footer"/>
</body>
<script src="__TMPL__/public/assets/js/base.js"></script>
<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></script>
</html>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html;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/happy.css" />
<link rel="stylesheet" href="__TMPL__/public/assets/css/mask.css" />
<title>独角日志详情</title>
<style>
.sw_deCon{
font-size: 0.26rem;
font-weight: 500;
color: #333;
}
</style>
</head>
<body>
<include file="public@header"/>
<div class="mask">
</div>
<include file="public@slide"/>
<div class="show_Detail">
<!--顶部人物介绍-->
<div class="sw_deTop">
<div class="sw_deTopImg">
<img src="{:cmf_get_image_url($res.avatar)}" alt="" />
</div>
<div class="sw_deTopTxt">
<h1 class="sw_deTopTxt1 one-txt-cut">{$res.full_name}</h1>
<p class="sw_deTopTxt2">{$res.post_excerpt}</p>
<span class="sw_deTopTxt3"></span>
</div>
</div>
<!--富文本内容-->
<div class="sw_deCon">
{$res.post_content}
</div>
</div>
<!--评论-->
<include file="public@comment"/>
<include file="public@footer"/>
<script src="__TMPL__/public/assets/js/base.js"></script>
<script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
<script src="__TMPL__/public/assets/js/public.js"></script>
</body>
</html>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html;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/happy.css" />
<link rel="stylesheet" href="__TMPL__/public/assets/css/mask.css" />
<title>明星访谈详情</title>
<style>
.sw_deCon{
font-size: 0.26rem;
font-weight: 500;
color: #333;
}
</style>
</head>
<body>
<include file="public@header"/>
<div class="mask">
</div>
<include file="public@slide"/>
<div class="show_Detail">
<!--顶部人物介绍-->
<div class="sw_deTop">
<div class="sw_deTopImg">
<img src="{:cmf_get_image_url($res.avatar)}" alt="" />
</div>
<div class="sw_deTopTxt">
<h1 class="sw_deTopTxt1 one-txt-cut">{$res.full_name}</h1>
<p class="sw_deTopTxt2">{$res.position} {$res.trade}</p>
<span class="sw_deTopTxt3"></span>
</div>
</div>
<!--富文本内容-->
<div class="sw_deCon">
{$res.post_content}
</div>
</div>
<!--评论-->
<include file="public@comment"/>
<include file="public@footer"/>
<script src="__TMPL__/public/assets/js/base.js"></script>
<script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
<script src="__TMPL__/public/assets/js/public.js"></script>
</body>
</html>
\ No newline at end of file
... ...
<!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" />
<title>旅游路线详情</title>
</head>
<body>
<include file="public@header"/>
<div class="index_fifteenth">
<div class="index_fifteenth_bg">
<div class="index_fifteenth_contant">
<div class="index_fifteenth_top">
<img src="__TMPL__/public/assets/images/cicon_58@2x.png" alt="" />
</div>
<div class="index_fifteenth_one">
{$res.post_title}
</div>
<div class="index_fifteenth_two">
<div class="index_fifteenth_two_left">
预订须知
</div>
<div class="index_fifteenth_two_right index_fifteen_two_right_bg">
{$res.notice}
</div>
</div>
<div class="index_fifteenth_two">
<div class="index_fifteenth_two_left">
出发地点
</div>
<div class="index_fifteenth_two_right">
{$res.place}
</div>
</div>
<div class="index_fifteenth_two">
<div class="index_fifteenth_two_left">
包含项目
</div>
<div class="index_fifteenth_two_right">
{$res.project}
</div>
</div>
<div class="index_fifteenth_three">
<div class="index_fifteenth_three_left">
商品售价:
</div>
<div class="index_fifteenth_three_right">
¥{$res.price}
</div>
</div>
<div class="index_fifteenth_four">
{$res.post_excerpt}
</div>
<div class="index_fifteenth_five">
<a href="{$res.pay_url}">
立即前往购买
</a>
</div>
</div>
</div>
</div>
<include file="public@footer"/>
</body>
<script src="__TMPL__/public/assets/js/base.js"></script>
<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></script>
</html>
\ No newline at end of file
... ...