H5分享相关

css/share.css

.madiaBlock{clear:both;}.madiaBlock:before,.madiaBlock:after{display:table;content:""}.madiaBlock:after{clear: both;}
.madiaBlock ul.mui-table-view{margin:10px 0;overflow: hidden;}
.madiaBlock ul.mui-table-view li{position: relative;cursor: pointer;}
.madiaBlock .madiaTit{position:relative;font-size:16px;color:#666;padding-left:10px;margin-top:15px;}
.madiaBlock .madiaTit{position:relative;font-size:16px;color:#666;padding-left:10px;margin-top:15px;padding-bottom: 10px;}
.madiaBlock .madiaTit:before{display:inline-block;content:"";width:4px;height: 16px;position:absolute;top:1px;left:0;background: #ff9900;}
.madiaBlock .madiaTit:after{position: absolute;bottom: 0;content:"";height: 1px;background: #E5E5E5;right: -15px;left:-15px;}
.madiaBlock .madiaHead{width:90px;height:60px;margin-top:-30px;position:absolute;border:1px solid #E5E5E5;top:50%;background-position: center;background-size: cover;}
.madiaBlock .madiaHead.useHead{width: 50px;height:50px;margin-top:-25px;background-image: url(../images/default-photo.jpg);border-radius: 50%;}
.madiaBlock .madiaHead.resouseHead{background-image: url(../images/default-resource.jpg);}
.madiaBlock .madiaHead.artHead{background-image: url(../images/default-artical.jpg);}
.madiaBlock .madiaHead.cmpHead{background:#FFFFFF;border-radius:0;}
.madiaBlock .madiaHead.cmpHead .boxBlock{width: 90px;height: 60px;}
.madiaBlock .madiaHead.cmpHead2{width:50px;height:40px;margin-top:-20px;background:#FFFFFF;border-radius:0;}
.madiaBlock .madiaHead.cmpHead2 .boxBlock{width:50px;height:40px;}
.madiaBlock .madiaHead.paperHead{background-image: url(../images/default-paper.jpg);}
.madiaBlock .madiaHead.patentHead{background-image: url(../images/default-patent.jpg);}
.madiaBlock .madiaInfo{padding-left:62px; width: 100%;margin:6px 0;overflow: hidden;}
.infocon ul{ padding:0; margin: 0; overflow: hidden;}
.infocon ul>li{list-style: none;}
.infocon>ul.mui-table-view>li{position: relative;overflow: hidden; padding: 11px 15px;}
.infocon>ul.mui-table-view>li:after{position: absolute;right: 0;bottom: 0;left:15px;height: 1px;content: '';-webkit-transform: scaleY(.5);transform: scaleY(.5); background-color: #c8c7cc;}
.infocon>ul.mui-table-view>li:last-child:after{background: none;}
ul.mui-table-view>li{position: relative;overflow: hidden; padding: 11px 0px;}
ul.mui-table-view>li:after{position: absolute;right: 0;bottom: 0;left:0px;height: 1px;content: '';-webkit-transform: scaleY(.5);transform: scaleY(.5); background-color: #c8c7cc;}
ul.mui-table-view>li:last-child:after{background: none;}
.infocon.listArea>ul{overflow: hidden;margin-right: -10px;margin-top:-10px;}
.infocon.listArea>ul>li{float: left;margin-right: 10px;margin-top:10px;border:1px solid #E5E5E5;border-radius:6px;padding:2px 12px;}
.infocon.madiaBlock>ul{margin:-15px;}
.infocon.madiaBlock>ul>li{padding:6px 15px;}
.infocon.madiaBlock>ul>li:after{left:15px}
.infocon.madiaBlock .h1Font{font-size: 16px;margin: 0;line-height: 24px;color: #333333;}
.infocon.madiaBlock .h2Font{font-size: 14px;margin: 0;line-height: 22px;color:#999999;}
/*下载按钮及公众二维码*/
.shareEcode{padding:20px 6px;background: #FFFFFF;}
.Ecodecon{width: 100%;margin-bottom: 40px;}
.Ecodebox{border-radius:4px;box-shadow: 0 2px 10px #ccc;padding:20px 10px;}
.Ecodebox .Ecodecon{position: relative;min-height:100px;margin: auto;max-width: 300px;}
.Ecodebox .Ecodecon img{position: absolute;left:0;top:50%;margin-top:-50px;width:100px;}
.Ecodebox .Ecodecon .codecon{padding-left:100px;text-align: center;}
.Ecodebox .Ecodecon .codecon h1{font-size: 18px;line-height:40px;font-weight:bold;color:#333;}
.Ecodebox .Ecodecon .codecon h2{font-size: 16px;line-height:30px;font-weight:normal;color:#333;}
.Ecodebox .Ecodecon .codecon h3{font-size: 14px;line-height:28px;font-weight:normal;color:#666;}
.Ecodeinfo{margin:-50px 10px 20px;}
/*专利论文邀请作者*/
.invitebody2{background:#ffbd51;padding-bottom:20px;}
.topSTit{position:relative;max-width:640px;padding:20px 0 0;text-align: center;}

e/a.html

		<!--留言-->
		<div class="madiaBlock displayNone">
			<div class="madiaTit" id="olisten">留言</div>
			<ul class="mui-table-view commentBlock noactiveTab">
			<ul class="mui-table-view commentBlock commentsArea">
		     
		   </ul>
		</div>
				if($data.hasOrgLogo) {
					mgimg="/images/org/" + $data.id + ".jpg";
				}
				document.getElementById("messImg").classList.add("cmpHead");
				document.getElementById("messImg").innerHTML='<div class="boxBlock" style="width:50px;height:50px;"><img class="boxBlockimg" id="companyImg" src="'+ mgimg+'"></div>'
				document.getElementById("messImg").classList.add("cmpHead2");
				document.getElementById("messImg").innerHTML='<div class="boxBlock"><img class="boxBlockimg" id="companyImg" src="'+ mgimg+'"></div>'
				if($data.authStatus == 3) {
					document.getElementById("auth").classList.add("authicon-com-ok");
				}
							}
							var li = document.createElement("li");
							li.innerHTML = '<div class="flexCenter clearfix" data-id="' + data.data[i].professor.id + '">' +
								'<div class="madiaHead useHead" style="background-image:url(' + baImg + ')"></div>' +
								'<div class="madiaHead useHead useHeadMsg" style="background-image:url(' + baImg + ')"></div>' +
								'<div class="madiaInfo">' +
								'<p><span class="h1Font" data-id="' + data.data[i].professor.id + '">' + data.data[i].professor.name + '</span><em class="authiconNew ' + userType.sty + '" title="科袖认证专家"></em></p>' +
								'</div>' +
								'</div>' +
								'<div class="madiaInfo">' +
								'<p class="h2Font">' + data.data[i].content + '</p>' +
								'<p class="operateSpan">' +
								'<span class="commenttime">' + commenTime(data.data[i].createTime) + '</span>' +

e/c.html

		</div>
	    <div class="shareEcode">
			<img class="Ecodecon" src="../images/ecordCard.jpg" />
			<div style="margin:-50px 10px 20px;">
			<div class="Ecodeinfo">
				<a href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app"><button class="frmbtn frmactive">下载移动客户端</button></a>
			</div>
		</div>
	    </div>
	</div>
<script type="text/javascript">
$(document).ready(function() {

e/l.html

<link rel="stylesheet" href="../css/reset.css" />
<link rel="stylesheet" href="../css/common.css" />
<link rel="stylesheet" href="../css/share.css" />
<style>
	#patentList,#paperList li{
		border-bottom: 1px solid #c8c7cc;
	}
	#patentList,#paperList li:last-child{
		border-bottom: none;
	}
</style>
<style>
	html,body{margin:0;padding:0px;background: #FFFFFF;}
	html,body{background: #FFFFFF;}
</style>
<script type="text/javascript" src="../js/jquery-1.11.1.js"></script>
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
				<div class="madiaBlock displayNone" id="paperModule">
						<div class="madiaTit">您可能感兴趣的论文</div>
						<ul class="mui-table-view" id="paperList">
							<li class="mui-table-view-cell">
						       	<div class="flexCenter OflexCenter mui-clearfix">
									<div class="madiaHead paperHead"></div>
									<div class="madiaInfo OmadiaInfo">
										<p class="ellipsisSty h1Font">CdS/CdSSe轴向异质结纳米线的非对称光波导及双波长激射</p>
										<p class="ellipsisSty h2Font">作者：李丹,梁君武,刘华伟,张学红,万强,张清林,潘安练</p>
									</div> 
								</div>
					      </li>
					    </ul>
				</div>
				<div class="madiaBlock displayNone" style="padding-bottom:50px;" id="leword">
				</div>
	    </div>
	    <div class="shareEcode">
	    	<div class="Ecodebox">
				<div class="Ecodecon clearfix">
					<img src="../images/weixin_code.jpg" />
					<div class="codecon">
						<h1>「 科袖 」</h1>
						<h2>搭建企业与专家的桥梁</h2>
						<h3>长按识别科袖公众号</h3>
					</div>
				</div>
			</div>
			<div style="margin:20px auto;">
			<img class="Ecodecon" src="../images/ecordCard.jpg" />
			<div class="Ecodeinfo">
				<a href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app"><button class="frmbtn frmactive">下载移动客户端</button></a>
			</div>
	    </div>
	var paperId = GetQueryString("id");
	isAgreeNum()
	function isAgreeNum() {
	var data = {"id": paperId}
	$.ajax({		
		url:"/ajax/ppaper/agreeCount",
		data:data,
		dataType: 'json', //数据格式类型
		type: 'get', //http请求类型
		timeout: 10000,
		async: true,
		success: function(data) {
			if(data.success){		
					$(".thumbBtn").html("赞 <span>" + data.data + "</span>");
		var data = {"id": paperId}
		$.ajax({		
			url:"/ajax/ppaper/agreeCount",
			data:data,
			dataType: 'json', //数据格式类型
			type: 'get', //http请求类型
			timeout: 10000,
			async: true,
			success: function(data) {
				if(data.success){		
						$(".thumbBtn").html("赞 <span>" + data.data + "</span>");
				}
			},
			error: function() {
				//$.MsgBox.Alert('提示',"服务器链接超时");
			}
		},
		error: function() {
			//$.MsgBox.Alert('提示',"服务器链接超时");
		}
	});
}
		});
	}
	leword();
	function leword(){
			$.ajax({
	$(".commentBlock").on("click","li>.flexCenter",function(){
		location.href="http://" + window.location.host + "/e/p.html?id=" + $(this).attr("data-id");
	})
	$("body").on("click",".authicon,.thumbBtn",function(){
	$("body").on("click",".goSpan,.thumbBtn",function(){
			location.href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app";
			$(this).addClass("activeThis");
		})
			"success" : function(data) {
				if(data.success) {
					console.log(data);
					var dataStr=data.data
					var dataStr=data.data;
					var lengthT;
					if(dataStr.length>5){
						lengthT=5;
					}else{
						lengthT=dataStr.length
					}
					if(dataStr.length > 0){
						$("#paperModule").show();
						var itemlist = '';
						for(var i = 0; i < dataStr.length; i++) {
						for(var i = 0; i < lengthT; i++) {
							var itemlist = '<li class="mui-table-view-cell" data-id="'+dataStr[i].id+'">';
							itemlist += '<div class="flexCenter OflexCenter mui-clearfix"><div class="madiaHead paperHead"></div>';
							itemlist += '<div class="madiaInfo OmadiaInfo">';
											liItem.className = "mui-table-view-cell"
											var oString = '<div class="flexCenter mui-clearfix">'
											oString += '<div class="madiaHead useHead" style="background-image:url('+ imgbg +')"></div>'
											oString += '<div class="madiaInfo"><p><span class="h1Font">'+ showPro.name +'</span><em class="authicon '+ authTy +'" title="'+ authTit +'"></em></p>'
											oString += '<div class="madiaInfo"><p><span class="h1Font">'+ showPro.name +'</span><em class="authiconNew '+ authTy +'" title="'+ authTit +'"></em></p>'
											oString += '<p class="ellipsisSty h2Font">'+ baseInfo +'</p>'
											oString += '</div></div>'
											oString += '</div><div class="goSpan"><span class="attenSpan" data-id="'+showPro.id+'">关注</span></div></div>'
											liItem.innerHTML = oString;
											document.getElementById("aboutAuthors").appendChild(liItem);
										}
			"success" : function(data) {
				if(data.success) {
					var $data = data.data;
					var lengthT;
					if($data.length>5){
						lengthT=5;
					}else{
						lengthT=$data.length
					}
					if($data.length > 0){
						document.getElementById("patentModule").style.display="block";
						for(var i = 0; i < $data.length; i++) {
						for(var i = 0; i < lengthT; i++) {
							var li = document.createElement("li");
							li.setAttribute("data-id", $data[i].id);
							li.className = "mui-table-view-cell";

e/p.html

		
	    <div class="shareEcode">
			<img class="Ecodecon" src="../images/ecordCard.jpg" />
			<div style="margin:-50px 10px 20px;">
			<div class="Ecodeinfo">
				<a href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app"><button class="frmbtn frmactive">下载移动客户端</button></a>
			</div>
	    </div>

e/r.html

	    </div>
	    <div class="shareEcode">
			<img class="Ecodecon" src="../images/ecordCard.jpg" />
			<div style="margin:-50px 10px 20px;">
			<div class="Ecodeinfo">
				<a href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app"><button class="frmbtn frmactive">下载移动客户端</button></a>
			</div>
	    </div>
						if(mydata.organization.hasOrgLogo) {
							mgimg="/images/org/" + mydata.organization.id + ".jpg";
						}
						othisPic.classList.add("cmpHead");
						othisPic.classList.add("cmpHead2");
						othisPic.innerHTML='<div class="boxBlock"><img class="boxBlockimg" id="companyImg" src="'+ mgimg+'"></div>'
						othisPic.parentNode.querySelector("madiaInfo").classList.add("OmadiaInfo");
						if(mydata.organization.authStatus==3){
							oauthFlag.classList.add("authicon-com-ok");	
						}

e/z.html

<link rel="stylesheet" href="../css/common.css" />
<link rel="stylesheet" href="../css/share.css" />
<style>
	html,body{margin:0;padding:0px;background: #FFFFFF;}
	#patentList,#paperList li{
		border-bottom: 1px solid #c8c7cc;
	}
	#patentList,#paperList li:last-child{
		border-bottom: none;
	}
	html,body{background: #FFFFFF;}
	
</style>
<script type="text/javascript" src="../js/jquery-1.11.1.js"></script>
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
				<div class="madiaBlock displayNone" id="patentModule">
						<div class="madiaTit">您可能感兴趣的专利</div>
						<ul class="mui-table-view" id="patentList">
							<!--<li class="mui-table-view-cell">
						       	<div class="flexCenter OflexCenter mui-clearfix">
									<div class="madiaHead patentHead"></div>
									<div class="madiaInfo OmadiaInfo">
										<p class="ellipsisSty h1Font">CdS/CdSSe轴向异质结纳米线的非对称光波导及双波长激射</p>
										<p class="ellipsisSty h2Font">作者：李丹,梁君武,刘华伟,张学红,万强,张清林,潘安练</p>
									</div>
								</div>
					       </li>-->
					    </ul>
				</div>
				<div class="madiaBlock displayNone" style="padding-bottom:50px;" id="leword">
				</div>
	    </div>
	    <div class="shareEcode">
	    	<div class="Ecodebox">
				<div class="Ecodecon clearfix">
					<img src="../images/weixin_code.jpg" />
					<div class="codecon">
						<h1>「 科袖 」</h1>
						<h2>搭建企业与专家的桥梁</h2>
						<h3>长按识别科袖公众号</h3>
					</div>
				</div>
			</div>
			<div style="margin:20px auto;">
			<img class="Ecodecon" src="../images/ecordCard.jpg" />
			<div class="Ecodeinfo">
				<a href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app"><button class="frmbtn frmactive">下载移动客户端</button></a>
			</div>
	    </div>
								'<div class="madiaHead useHead" style="background-image:url(' + baImg + ')"></div>' +
								'<div class="madiaInfo">' +
								'<p><span class="h1Font" data-id="' + data.data[i].professor.id + '">' + data.data[i].professor.name + '</span><em class="authiconNew ' + userType.sty + '" title="科袖认证专家"></em></p>' +
								'</div>' +
								'</div>' +
								'<div class="madiaInfo">' +
								'<p class="h2Font">' + data.data[i].content + '</p>' +
								'<p class="operateSpan">' +
								'<span class="commenttime">' + commenTime(data.data[i].createTime) + '</span>' +
	$(".commentBlock").on("click","li>.flexCenter",function(){
		location.href="http://" + window.location.host + "/e/p.html?id=" + $(this).attr("data-id");
	})
	$("body").on("click",".authicon,.thumbBtn",function(){
	$("body").on("click",".goSpan,.thumbBtn",function(){
			location.href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app";
			$(this).addClass("activeThis");
		})
				if(data.success) {
					console.log(data);
					var dataStr=data.data
					var lengthT;
					if(dataStr.length>5){
						lengthT=5;
					}else{
						lengthT=dataStr.length
					}
					if(dataStr.length > 0){
						$("#patentModule").show();
						var itemlist = '';
						for(var i = 0; i < dataStr.length; i++) {
						for(var i = 0; i < lengthT; i++) {
							
							var itemlist = '<li class="mui-table-view-cell" data-id="'+dataStr[i].id+'">';
							itemlist += '<div class="flexCenter OflexCenter mui-clearfix"><div class="madiaHead patentHead"></div>';
											liItem.className = "mui-table-view-cell"
											var oString = '<div class="flexCenter mui-clearfix">'
											oString += '<div class="madiaHead useHead" style="background-image:url('+ imgbg +')"></div>'
											oString += '<div class="madiaInfo"><p><span class="h1Font">'+ showPro.name +'</span><em class="authicon '+ authTy +'" title="'+ authTit +'"></em></p>'
											oString += '<div class="madiaInfo"><p><span class="h1Font">'+ showPro.name +'</span><em class="authiconNew '+ authTy +'" title="'+ authTit +'"></em></p>'
											oString += '<p class="ellipsisSty h2Font">'+ baseInfo +'</p>'
											oString += '</div></div>'
											oString += '</div><div class="goSpan"><span class="attenSpan" data-id="'+showPro.id+'">关注</span></div></div>'
											liItem.innerHTML = oString;
											document.getElementById("aboutAuthors").appendChild(liItem);
										}
				if(data.success) {
					console.log(data);
					var dataStr=data.data
					var lengthT;
					if(dataStr.length>5){
						lengthT=5;
					}else{
						lengthT=dataStr.length
					}
					if(dataStr.length > 0){
						$("#paperModule").show();
						var itemlist = '';
						for(var i = 0; i < dataStr.length; i++) {
						for(var i = 0; i < lengthT; i++) {
							var itemlist = '<li class="mui-table-view-cell" data-id="'+dataStr[i].id+'">';
							itemlist += '<div class="flexCenter OflexCenter mui-clearfix"><div class="madiaHead paperHead"></div>';
							itemlist += '<div class="madiaInfo OmadiaInfo">';