enjoy_detail.html 2.9 KB
<!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">
	<link rel="stylesheet" href="__TMPL__/public/assets/css/mask.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="mask">

		</div>
		<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>
	<!-- 侧边栏 -->
	<include file="public@slide"/>
	<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>