
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>晒单 - {wc:$webname}触屏版</title>     
    <meta content="app-id=518966501" name="apple-itunes-app" />     
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, user-scalable=no, maximum-scale=1.0"/>
    <meta content="yes" name="apple-mobile-web-app-capable" />     
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />     
    <meta content="telephone=no" name="format-detection" />
	<link rel="stylesheet" type="text/css" href="{G_TEMPLATES_CSS}/aui/foot.css" />
    <link href="{G_TEMPLATES_CSS}/mobile/comm.css?" rel="stylesheet" type="text/css" />
	<link href="{G_TEMPLATES_CSS}/mobile/single.css?" rel="stylesheet" type="text/css" />
	<script src="{G_TEMPLATES_JS}/mobile/jquery190.js" language="javascript" type="text/javascript"></script>
	<script id="pageJS" data="{G_TEMPLATES_JS}/mobile/postlist.js" language="javascript" type="text/javascript"></script>
</head>
<body>
	<div class="m_popUp" style="display: none;" id="share" onclick="share_close()"><div class="m_guide"></div><cite></cite></div>
<div class="h5-1yyg-v1">
    
<!-- 栏目页面顶部 -->

<header class="header">
<div class="n-header-wrap">
<div class="backbtn">
<a href="javascript:;" onclick="history.go(-1)" class="h-count white">
</a>
</div>
<div class="h-top-right ">
<a href="{WEB_PATH}/mobile/home" class="h-search white"></a>
</div>
<div class="n-h-tit"><h1 class="header-logo">晒单</h1></div>
</div>
</header>

<style>
@charset "utf-8";
.wx-new-icon {
	background:url(../.../../../Images/wx-single-icon.png) no-repeat 0 0;
	position:relative;
	-webkit-background-size:15px auto;
	background-size:15px auto;
}
.zan {
	display:inline-block;
	vertical-align:middle;
	width:16px;
	height:18px;
	background-position:0 -21px;
	margin-top:-1px;
}
.talk {
	display:inline-block;
	vertical-align:middle;
	width:16px;
	height:18px;
	background-position:0 -65px;
}
.share {
	display:inline-block;
	vertical-align:middle;
	width:16px;
	height:18px;
	background-position:0 0;
}
.nav-wrapper {
	height:40px;
	background-color:#f7f7f7;
	font-size:16px;
	position:relative;
	z-index:99;
	border-bottom:1px solid #dedede;
}
.wx-port-nav {
	width:72%;
	height:40px;
	display:block;
	float:left;
	position:relative;
}
.wx-port-nav:before,.wx-port-nav:after {
	content:'';
	display:block;
	width:1px;
	height:24px;
	position:absolute;
	top:9px;
}
.wx-port-nav:before {
	background-color:#ccc;
	right:0;
}
.wx-port-nav:after {
	background-color:#fff;
	right:-1px;
	clear:both;
}
.wx-port-nav li {
	display:block;
	float:left;
	text-align:center;
	width:25%;
}
.wx-port-nav li a {
	display:inline-block;
	color:#999;
	height:30px;
	line-height:30px;
	vertical-align:middle;
	margin-top:5px;
	padding:0 3px;
	border-bottom:2px solid transparent;
	box-sizing:border-box;
}
.wx-port-nav li.current a {
	border-color:#f60;
	color:#f60;
}
.wx-nav-menu {
	float:left;
	width:28%;
	height:40px;
	line-height:40px;
	text-align:center;
	position:relative;
}
.wx-nav-menu a {
	color:#999;
}
.wx-nav-menu .column span {
	width:4px;
	height:4px;
	display:inline-block;
	margin-left:2px;
	position:relative;
	top:1px;
	background-position:0 0;
	background-repeat:no-repeat;
}
.wx-nav-menu:before,.wx-nav-menu:after {
	content:'';
	display:block;
	width:0;
	height:0;
	position:absolute;
	border-width:8px 7px;
	border-color:transparent;
	left:50%;
	margin-left:-7px;
	display:none;
}
.wx-nav-menu:before {
	border-style:solid;
	border-bottom-color:#dedede;
	top:24px;
	z-index:3;
}
.wx-nav-menu:after {
	border-style:solid;
	border-bottom-color:#fff;
	top:25px;
	z-index:4;
}
.wx-nav-menu.current:before,.wx-nav-menu.current:after {
	display:block;
}
.wx-show-inner .show-list {
	padding:0 10px 0;
	border-bottom:1px solid #dedede;
	border-top:1px solid #dedede;
	position:relative;
	margin-top:10px;
	background-color:#fff;
}
.wx-show-inner .show-list:first-child {
	margin-top:0;
	border-top:0;
}
.wx-show-inner .show-head {
	padding-top:10px;
	line-height:16px;
}
.wx-show-inner .show-u {
	font-size:12px;
	padding-right:2px;
}
.wx-show-inner .show-list h3 {
	padding-top:4px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	font-size:16px;
	color:#666;
}
.wx-show-inner .show-head h3 a {
	font-size:16px;
	color:#666;
}
.wx-show-inner .share-btn-wrap {
	display:block;
	width:50px;
	height:16px;
	position:absolute;
	top:9px;
	right:8px;
	padding:10px 0 10px 5px;
	color:#bbb;
	z-index:2;
}
.wx-show-inner .share-btn-wrap i {
	display:block;
	width:16px;
	height:18px;
	background:url(../../../Images/wx-single-icon.png) no-repeat 0 0;
	background-size:16px;
	float:left;
	margin-right:3px;
}
.wx-show-inner .show-con {
	max-height:40px;
	line-height:20px;
	padding:5px 0 0;
	word-break:break-all;
	font-size:14px;
	overflow:hidden;
}
.wx-show-inner .show-con p {
	color:#999;
}
.wx-show-inner .show-time {
	color:#bbb;
	font-size:12px;
}
.wx-show-inner .show-pic {
	padding-top:10px;
}
.wx-show-inner .show-pic ul {
	margin-right:-8px;
}
.wx-show-inner .show-pic .pic-one {
	margin:0;
}
.wx-show-inner .show-pic li {
	box-sizing:border-box;
	float:left;
	padding-right:8px;
}
.wx-show-inner .pic-more li {
	width:33.3%;
	max-width:130px;
	width:100px;
	height:100px;
}
.wx-show-inner .pic-one li {
	width:100%;
	height:180px;
	overflow:hidden;
	padding:0;
}
.wx-show-inner .show-pic img {
	width:100%;
}
.wx-show-inner .pic-one li img {
	margin-top:-100px;
	position:relative;
}
.wx-show-inner .pic-more li img {
	display:block;
	width:90px;
	height:90px;
	border:1px solid #f3f3f3;
}
.wx-show-inner .show-pic li:after {
	content:'';
	display:table;
	clear:both;
}
.wx-show-tail {
	width:100%;
	position:absolute;
	top:40px;
	left:0;
	border-top:1px solid #dedede;
	background-color:#fff;
	z-index:98;
}
.wx-show-tail .tail-inner {
	width:100%;
	font-size:14px;
}
.wx-show-tail .tail-inner li {
	height:44px;
	line-height:44px;
	text-align:center;
	box-sizing:border-box;
	width:33.3%;
	float:left;
	border-bottom:1px solid #dedede;
	border-right:1px solid #dedede;
}
.wx-show-tail .tail-inner li:nth-child(3n+0) {
	border-right:none;
	width:33.4%;
}
.wx-show-tail .tail-inner li a {
	display:block;
	color:#999;
}
.wx-show-tail .tail-inner li.current a {
	color:#f60;
}
.opt-wrapper {
	height:40px;
	position:relative;
}
.opt-wrapper .opt-inner {
	height:40px;
	float:right;
}
.opt-wrapper .opt-inner li {
	height:18px;
	padding:10px 0 12px 14px;
	float:right;
	margin-left:14px;
	position:relative;
}
.opt-wrapper .opt-inner a {
	display:block;
	height:18px;
	line-height:18px;
	color:#bbb;
}
.z-reward {
	display:inline-block;
	position:absolute;
	right:10px;
	top:0;
}
.z-reward {
	background:url(../../../images/share-img.png?v=150126);
	background-size:90px auto;
}
.z-reward {
	background-position:0 -0px;
	width:49px;
	height:23px;
	padding-top:8px;
	text-align:center;
}
.z-reward em {
	font-size:10px;
	color:#fff;
}
.wx-show-pro {
	padding:0 10px;
}
.wx-show-pro .show-head {
	padding:10px 70px 0 0;
}
.wx-show-pro .show-head h1 {
	font-size:20px;
	color:#333;
}
.wx-show-pro .show-user {
	padding:10px 0 10px 36px;
	position:relative;
	font-size:14px;
}
.wx-show-pro .show-user .photo {
	display:block;
	width:30px;
	height:30px;
	border-radius:50%;
	overflow:hidden;
	position:absolute;
	top:10px;
	left:0;
}
.wx-show-pro .show-user .photo img {
	display:block;
	width:100%;
	height:100%;
	border-radius:50%;
}
.wx-show-pro .show-user .about {
	color:#bbb;
	font-size:12px;
}
.wx-show-pro .show-user .read {
	padding-left:12px;
}
.wx-show-pro .show-info .tail {
	padding:6px 8px;
	border-radius:6px;
	background-color:#eee;
	color:#999;
	font-size:12px;
}
.wx-show-pro .show-info .tail p {
	height:20px;
	line-height:20px;
	word-break:break-all;
	overflow:hidden;
}
.wx-show-pro .show-info .txt p {
	text-align:center;
	padding-top:10px;
	font-size:16px;
}
.wx-show-pro .show-info .txt .pro {
	line-height:24px;
	color:#666;
	text-align:left;
	word-break:break-all;
}
.wx-show-pro .show-info p img {
	max-width:300px;
	display:block;
	margin:0 auto;
}
.wx-show-message {
	padding-top:20px;
}
.wx-show-message .mess-menu {
	width:100%;
	height:10px;
	border-top:1px solid #dedede;
	position:relative;
}
.wx-show-message .mess-menu span {
	display:block;
	height:20px;
	line-height:20px;
	background-color:#fff;
	padding-right:8px;
	color:#999;
	position:absolute;
	top:-12px;
}
.wx-show-message .mess-wrapper {
	padding-bottom:48px;
}
.wx-show-message .mess-list {
	padding:8px 0 8px 42px;
	border-bottom:1px solid #eee;
	position:relative;
	min-height:40px;
}
.wx-show-message .mess-list .photo {
	display:block;
	width:36px;
	height:36px;
	position:absolute;
	left:0;
	top:8px;
}
.wx-show-message .mess-list .photo img {
	display:block;
	width:36px;
	height:36px;
	border-radius:50%;
}
.wx-show-message .mess-list p {
	line-height:20px;
	color:#666;
	word-break:break-all;
	font-size:14px;
}
.wx-show-message .mess-list p .blue {
	font-size:12px;
}
.wx-show-message .mess-list .time {
	color:#bbb;
	font-size:12px;
}
.mess-footer {
	width:100%;
	height:48px;
	position:fixed;
	bottom:0;
	left:0;
	background-color:#f7f7f7;
	border-top:1px solid #dedede;
}
.mess-footer li {
	box-sizing:border-box;
	border-right:1px solid #dedede;
	width:33.3%;
	height:48px;
	float:left;
	position:relative;
}
.mess-footer li:last-child {
	border-right:none;
	width:33.4%;
}
.mess-footer li a {
	display:block;
	line-height:48px;
	text-align:center;
	color:#999;
}
.mess-footer li .share {
	margin-right:1px;
}
.mess-footer li.current .zan {
	background-position:0 -42px;
}
.wx-show-pro .s_comments {
	padding:10px 0;
}
.s_comments {
	padding:10px;
	-webkit-box-sizing:border-box;
}
.s_comments textarea {
	font-size:16px;
	border:1px solid #dedede;
	border-radius:5px;
	width:100%;
	height:150px;
	color:#ccc;
	padding:3px;
	-webkit-box-sizing:border-box;
}
.s_comments span {
	display:block;
	color:#bbb;
	padding-top:5px;
}
.s_comments p {
	margin-top:15px;
}
.s_comments a {
	display:inline-block;
	width:49%;
	height:38px;
	line-height:38px;
	font-size:14px;
	text-align:center;
	-webkit-box-sizing:border-box;
}
.s_comments a.cancelBtn {
	border:1px solid #dedede;
	background:#fff;
	color:#bbb;
	border-radius:5px;
	letter-spacing:5px;
}
.s_comments a.orangeBtn {
	border:1px solid #f60;
}
.null-mess {
	font-size:14px;
	height:80px;
	line-height:60px;
	color:#999;
	text-align:center;
}
.m_share {
	position:relative;
	overflow:hidden;
}
.m_popUp {
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	z-index:1000;
}
.m_guide {
	display:block;
	width:100%;
	height:100%;
	background:#000;
	opacity:0.8;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
	position:absolute;
	top:0;
	left:0;
	z-index:98;
}
.m_popUp cite {
	display:block;
	background:url(../../../images/share_03.png) top right no-repeat;
	background-size:273px auto;
	height:230px;
	margin:10px 10px 0 0;
	position:relative;
	z-index:99;
}
</style>
<!-- 内页顶部 -->

    
    <div id="navBox" class="g-snav m_listNav">
        <div class="g-snav-lst z-sgl-crt"><a href="javascript:;" class="gray9">最新晒单</a><b></b></div>
        <div class="g-snav-lst"><a href="javascript:;" class="gray9">人气晒单</a><b></b></div>
        <div class="g-snav-lst"><a href="javascript:;" class="gray9">评论最多</a></div>
    </div>

    <!-- 晒单列表 -->
    <section>	
		<div class="cSingleCon" id="loadingPicBlock">
		    <div id="postBox10" class="cSingleCon2" style="margin-left: 0px;"></div>

        </div>
		<div id="postLoading" class="loading loading2"><b></b>正在加载</div>
        <a id="btnLoadMore" class="loading" href="javascript:;" style="display:none;">点击加载更多</a>
		<a id="btnLoadMore2" class="loading"  style="display:none;">没有数据</a>
        <a id="btnLoadMore3" class="loading"  style="display:none;">已经到底了</a>
    </section> 
	<input id="urladdress" value="" type="hidden" />
    <input id="pagenum" value="" type="hidden" />
<!--{wc:templates "mobile/index","footer"}-->

<script language="javascript" type="text/javascript">
//open share
function share_on(){
document.getElementById("share").style.display='block';
}
//close share
function share_close(){
document.getElementById("share").style.display='none';
}

window.onload=function(){
	sdajax('new');
}
function sdajax(parm){	
	$("#urladdress").val('');
	$("#pagenum").val('');
	$.getJSON('{WEB_PATH}/mobile/shaidan/shaidanajax/'+parm,function(data){	
		$("#postLoading").hide();
		if(data[0].sum){
			var fg=parm.split("/");
				$("#urladdress").val(fg[0]);
				$("#pagenum").val(data[0].page);
			for(var i=0;i<data.length;i++){
				var pic=data[i].sd_photolist.split(";");
				var t=new Date(data[i].sd_time);
				var div='<div id="loadingPicBlock" class="wx-show-wrapper"><div class="wx-show-inner marginB"><div id="divPostList"><div class="show-list">';
					div+='<a href="{WEB_PATH}/mobile/shaidan/detail/'+data[i].sd_id+'"><h3>'+data[i].sd_title+'</h3></a><div class="show-head">';
					div+='<a href="{WEB_PATH}/mobile/mobile/userindex/'+data[i].sd_userid+'" class="show-u blue" id="'+data[i].sd_userid+'">'+data[i].user+'</a></div>';
					div+='<a href="{WEB_PATH}/mobile/shaidan/detail/'+data[i].sd_id+'">';
					/*
					div+='<ul><li><em class="blue" id="'+data[i].sd_userid+'">'+data[i].user+'</em>';
					div+='<span><strong class="c9">：</strong>'+data[i].sd_title+'</span> ';
					div+='<h5>'+data[i].time+'</h5></li>';
					div+='<li><p>'+data[i].sd_content+'</p></li>';
					*/
					div+='<div class="show-pic"><ul class="pic-more clearfix"><li class="maxImg"  id="'+data[i].sd_id+'">';
					for(var x=0;x<pic.length-1;x++){
						div+='<img src="{G_UPLOAD_PATH}/'+pic[x]+'">';
					}
					div+='</li></ul>';
					div+='</div><div class="show-con"><p name="content">'+data[i].sd_content+'</p><span class="show-time">'+data[i].time+'</span></div></a><div class="share-btn-wrap" onclick="share_on()"><i></i>分享</div></div></div> </div>';
				$(".cSingleCon2").append(div);
			}
			if(data[0].page<=data[0].sum){
				$("#btnLoadMore").css('display','block');
				$("#btnLoadMore2").css('display','none');
				$("#btnLoadMore3").css('display','none');
			}else if(data[0].page>data[0].sum){
				$("#btnLoadMore").css('display','none');
				$("#btnLoadMore2").css('display','none');
				$("#btnLoadMore3").css('display','block');
			}
		}else{
			$("#btnLoadMore").css('display','none');
			$("#btnLoadMore2").css('display','block');	
			$("#btnLoadMore3").css('display','none');			
		}
	})
}
$(function(){
	$("#navBox div").click(function(){
		$(".cSingleCon2 div").remove();
		e=$(this).index();
		$("#navBox div").removeClass('z-sgl-crt').eq(e).addClass('z-sgl-crt');
		switch(e){
			case 0:
			sdajax('new');
			break;
			case 1:
			sdajax('renqi');
			break;
			case 2:
			sdajax('pinglun');
			break;
		}
	});
	//加载更多
	$("#btnLoadMore").click(function(){		
		var url=$("#urladdress").val(),
			page=$("#pagenum").val();
		sdajax(url+'/'+page);
	});
	//返回顶部
	$(window).scroll(function(){
		if($(window).scrollTop()>50){
			$("#btnTop").show();
		}else{
			$("#btnTop").hide();
		}
	});
	$("#btnTop").click(function(){
		$("body").animate({scrollTop:0},10);
	});
	//跳转页面
	var gt='.wx-show-wrapper .maxImg';
	$(document).on('click',gt,function(){
		var id=$(this).attr('id');
		if(id){
			window.location.href="{WEB_PATH}/mobile/shaidan/detail/"+id;
		}			
	});
	$(document).on('click','.wx-show-wrapper .blue',function(){
		var id=$(this).attr('id');
		if(id){
			window.location.href="{WEB_PATH}/mobile/mobile/userindex/"+id;
		}	
	});	
})
</script>

</div>
</body>
</html>