Startseite Erkunden Hilfe
Registrieren Anmelden
jiapeng
/
portal-front
Beobachten 3
Favorit hinzufügen 0
Fork 0
Code Issues 0 Pull-Requests 0 Commits 325 Releases 0 Wiki

portal html css js resource

Struktur: 7b6aa93162
Branches Tags
portal-front
/
ekexiu
/
shareArticalinfor.html

shareArticalinfor.html 13KB
Verlauf Originalformat

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347 
  1. <!DOCTYPE html>
  2. <html>
  4. 	<head>
  5. 		<meta charset="UTF-8">
  6. 		<title></title>
  7. 		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  8. 		<link rel="stylesheet" href="../css/reset.css" />
  9. 		<link rel="stylesheet" href="../css/common.css" />
  10. 		<link rel="stylesheet" href="../css/index.css" />
  11. 		<link rel="stylesheet" href="../css/share.css" />
  12. 		<style>
  13. 			html,
  14. 			body {
  15. 				background: #ffffff;
  16. 			}
  17. 			
  18. 			.proinfor .headblock {
  19. 				margin: 0 2% 4px 0;
  20. 			}
  21. 			
  22. 			.proinfor .headblock .headimg {
  23. 				max-width: 64px;
  24. 				width: 64px;
  25. 				overflow: hidden;
  26. 				margin: auto;
  27. 			}
  28. 			
  29. 			.proinfor .media-body {
  30. 				width: 76%;
  31. 			}
  32. 			
  33. 			.listtit {
  34. 				font-size: 15px;
  35. 				line-height: 26px;
  36. 				color: #333333;
  37. 			}
  38. 			
  39. 			.listtit2 {
  40. 				font-size: 13px;
  41. 				line-height: 20px;
  42. 				color: #666666;
  43. 			}
  44. 			
  45. 			.listtit3 {
  46. 				font-size: 12px;
  47. 				line-height: 18px;
  48. 				color: #888888;
  49. 			}
  50. 			
  51. 			@media only screen and (min-width: 100px) and (max-width: 350px) {
  52. 				.proinfor .media-body {
  53. 					width: 70%;
  54. 				}
  55. 			}
  56. 		</style>
  57. 	</head>
  59. 	<body>
  60. 		<div style="display:none">
  61. 			<img id="hiddenImg" src="http://www.ekexiu.com/images/logo180.png" width="100%" />
  62. 		</div>
  63. 		<div class="contentBody2">
  64. 			<div class="art_topicBox">
  65. 				<div class="art_img" id="articleImg"></div>
  66. 				<div class="art_tbox">
  67. 					<h4 id="artical_topic"></h4>
  68. 				</div>
  69. 			</div>
  70. 			<div class="articalBox">
  71. 				<ul id="proInfor">
  72. 					<li style="padding:8px 20px 8px 10px;">
  73. 						<a class="proinfor clearfix">
  74. 							<div class="headblock floatL"><img id="proHead" class="headimg headRadius" src="../images/default-photo.jpg"></div>
  75. 							<div class="media-body floatL">
  76. 								<span class="listtit"><span id="proName"></span><em class="authicon authicon-cu" style="position:absolute;margin:4px 0 0 2px ;"></em></span>
  77. 								<div class="listtit2"><span id="proTitle"></span><span id="proOffice"></span><span id="proOrg"></span><span id="proAddress"></span></div>
  78. 								<div class="mui-ellipsis listtit3" id="proRlist"></div>
  79. 								<div class="mui-ellipsis listtit3" id="proZlist"></div>
  80. 							</div>
  81. 						</a>
  82. 					</li>
  83. 				</ul>
  84. 				<div class="line01" style="margin:4px 0 10px 0;"></div>
  86. 				<div id="artical_real">
  87. 					<!--body-->
  88. 					<div id="main_content">
  89. 					</div>
  90. 					<!--body-->
  91. 				</div>
  92. 				<div class="blockGroup mainbox" style="padding-bottom:40px;">
  93. 					<div class="maincon alignCenter">
  94. 						<div style="margin-top: 30px;"><span style="color:#ff9900; font-size: 16px;line-height: 32px;">「 科袖 」</span><br />搭建企业与专家的桥梁</div>
  95. 						<div class="frmbox" style="margin:20px auto;">
  96. 							<a href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app"><button class="frmbtn frmactive">下载移动客户端</button></a>
  97. 						</div>
  98. 						<div>
  99. 							<img style="width:120px;" src="../images/weixin_code.jpg" />
  100. 							<div style="color:#CCCCCC;font-size:13px;">关注科袖公众号</div>
  101. 						</div>
  102. 					</div>
  103. 				</div>
  104. 			</div>
  105. 		</div>
  106. 		<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
  107. 		<script type="text/javascript" src="../js/jquery-1.11.1.js"></script>
  108. 		<script>
  109. 			$(document).ready(function() {
  110. 				var imgUrl = "http://www.ekexiu.com/images/logo180.png";
  111. 				var lineLink = document.location.href;
  112. 				var descContent;
  113. 				var shareTitle;
  114. 				var appid = '';
  115. 				var articleId = GetQueryString("articleId");
  117. 				function GetQueryString(name) {
  118. 					var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
  119. 					var r = window.location.search.substr(1).match(reg);
  120. 					var context = "";
  121. 					if(r != null)
  122. 						context = r[2];
  123. 					reg = null;
  124. 					r = null;
  125. 					return context == null || context == "" || context == "undefined" ? "" : decodeURI(context);
  126. 				}
  128. 				function proInfoMain() {
  129. 					$.ajax({
  130. 						url: "/ajax/article/query",
  131. 						dataType: 'json', //数据格式类型
  132. 						type: 'GET', //http请求类型
  133. 						async: false,
  134. 						data: {
  135. 							"articleId": articleId
  136. 						},
  137. 						timeout: 10000, //超时设置
  138. 						success: function(data) {
  139. 							console.log(data)
  140. 							var $info = data.data || {};
  141. 							if(data.success && data.data) {
  142. 								var nameli = document.getElementById("nameli");
  143. 								var proZlist = document.getElementById("proZlist"); //专家资源
  144. 								var proRlist = document.getElementById("proRlist"); //专家资源
  145. 								var proName = document.getElementById("proName");
  146. 								var proTitle = document.getElementById("proTitle");
  147. 								var proOffice = document.getElementById("proOffice");
  148. 								var proOrg = document.getElementById("proOrg");
  149. 								var proAddress = document.getElementById("proAddress");
  150. 								var articleImg = document.getElementById("articleImg");
  151. 								var artical_topic = document.getElementById("artical_topic");
  152. 								var main_content = document.getElementById("main_content");
  153. 								var hiddenImg = document.getElementById("hiddenImg"); //隐藏文章头图位置
  154. 								proName.innerText = $info.professor.name;
  155. 								if($info.professor.title && $info.professor.office && $info.professor.orgName && $info.professor.address) {
  156. 									proTitle.innerText = $info.professor.title + "，";
  157. 									proOffice.innerText = $info.professor.office + "，";
  158. 									proOrg.innerText = $info.professor.orgName + " | ";
  159. 									proAddress.innerText = $info.professor.address;
  160. 								} else if(!$info.professor.title && $info.professor.office && $info.professor.orgName && $info.professor.address) {
  161. 									proOffice.innerText = $info.professor.office + "，";
  162. 									proOrg.innerText = $info.professor.orgName + " | ";
  163. 									proAddress.innerText = $info.professor.address;
  164. 								} else if($info.professor.title && !$info.professor.office && $info.professor.orgName && $info.professor.address) {
  165. 									proTitle.innerText = $info.professor.title + "，";
  166. 									proOrg.innerText = $info.professor.orgName + " | ";
  167. 									proAddress.innerText = $info.professor.address;
  168. 								} else if($info.professor.title && $info.professor.office && !$info.professor.orgName && $info.professor.address) {
  169. 									proTitle.innerText = $info.professor.title + "，";
  170. 									proOffice.innerText = $info.professor.office + " | ";
  171. 									proAddress.innerText = $info.professor.address;
  172. 								} else if($info.professor.title && $info.professor.office && $info.professor.orgName && !$info.professor.address) {
  173. 									proTitle.innerText = $info.professor.title + "，";
  174. 									proOffice.innerText = $info.professor.office + "，";
  175. 									proOrg.innerText = $info.professor.orgName;
  176. 								} else if(!$info.professor.title && !$info.professor.office && $info.professor.orgName && $info.professor.address) {
  177. 									proOrg.innerText = $info.professor.orgName + " | ";
  178. 									proAddress.innerText = $info.professor.address;
  179. 								} else if(!$info.professor.title && $info.professor.office && !$info.professor.orgName && $info.professor.address) {
  180. 									proOffice.innerText = $info.professor.office + " | ";
  181. 									proAddress.innerText = $info.professor.address;
  182. 								} else if(!$info.professor.title && $info.professor.office && $info.professor.orgName && !$info.professor.address) {
  183. 									proOffice.innerText = $info.professor.office + "，";
  184. 									proOrg.innerText = $info.professor.orgName;
  185. 								} else if($info.professor.title && !$info.professor.office && !$info.professor.orgName && $info.professor.address) {
  186. 									proTitle.innerText = $info.professor.title + " | ";
  187. 									proAddress.innerText = $info.professor.address;
  188. 								} else if($info.professor.title && !$info.professor.office && $info.professor.orgName && !$info.professor.address) {
  189. 									proOffice.innerText = $info.professor.title + "，";
  190. 									proAddress.innerText = $info.professor.orgName;
  191. 								} else if($info.professor.title && $info.professor.office && !$info.professor.orgName && !$info.professor.address) {
  192. 									proTitle.innerText = $info.professor.title + "，";
  193. 									proOffice.innerText = $info.professor.office;
  194. 								} else if(!$info.professor.title && !$info.professor.office && !$info.professor.orgName && $info.professor.address) {
  195. 									proAddress.innerText = $info.professor.address;
  196. 								} else if(!$info.professor.title && !$info.professor.office && $info.professor.orgName && !$info.professor.address) {
  197. 									proOrg.innerText = $info.professor.orgName;
  198. 								} else if(!$info.professor.title && $info.professor.office && !$info.professor.orgName && !$info.professor.address) {
  199. 									proOffice.innerText = $info.professor.office;
  200. 								} else if($info.professor.title && !$info.professor.office && !$info.professor.orgName && !$info.professor.address) {
  201. 									proTitle.innerText = $info.professor.title;
  202. 								}
  203. 								var rlist = ''
  204. 								for(var n = 0; n < $info.professor.researchAreas.length; n++) {
  205. 									rlist += '<span>' + $info.professor.researchAreas[n].caption + '</span>';
  206. 									if(n != $info.professor.researchAreas.length - 1) {
  207. 										rlist += '，';
  208. 									}
  209. 								}
  210. 								($info.professor.researchAreas) ? proRlist.innerHTML = rlist: proRlist.innerText = '';
  211. 								var zlist = "";
  212. 								for(var n = 0; n < $info.professor.resources.length; n++) {
  213. 									zlist += '<span>' + $info.professor.resources[n].resourceName + '</span>';
  214. 									if(n != $info.professor.resources.length - 1) {
  215. 										zlist += '，';
  216. 									}
  217. 								}
  218. 								($info.professor.resources) ? proZlist.innerHTML = zlist: proZlist.innerText = '';
  220. 								if($info.articleImg) {
  221. 									articleImg.style.backgroundImage = 'url(/data/article/' + $info.articleImg + ')';
  222. 									//hiddenImg.src = '/data/article/' + $info.articleImg + '';
  223. 									//imgUrl = '/data/article/' + $info.articleImg + '';
  224. 								} else {
  225. 									//imgUrl = 'http://www.ekexiu.com/images/logo180.png';
  226. 									//alert(imgUrl);
  227. 									//articleImg.style.backgroundImage  = 'url(../images/logo180.png)';
  228. 								}
  229. 								if($info.professor.hasHeadImage) {
  230. 									document.getElementById('proHead').src = "/images/head/" + $info.professorId + "_l.jpg";
  231. 								}
  232. 								artical_topic.innerText = $info.articleTitle;
  234. 								//title标题栏
  235. 								shareTitle = "【科袖文章】" + $info.articleTitle + "";
  236. 								window.setInterval(function() {
  237. 									document.title = "【科袖文章】" + $info.articleTitle + "";
  238. 								}, 500);
  240. 								if($info.articleContent) {
  241. 									main_content.innerHTML = $info.articleContent;
  242. 									descContent = main_content.innerText;
  243. 									var oImg = main_content.getElementsByTagName("img");
  244. 									for(var i = 0; i < oImg.length; i++) {
  245. 										(function(n) {
  246. 											var att = oImg[n].src.substr(7);
  247. 											console.log(oImg[n].src)
  248. 											oImg[n].style.width = "100%";
  249. 											oImg[n].parentNode.style.textIndent = "0em";
  250. 										})(i);
  251. 									}
  252. 								} else {
  253. 									descContent = "";
  254. 								}
  255. 							}
  256. 						},
  257. 						error: function() {
  258. 							return;
  259. 						}
  260. 					});
  262. 				}
  263. 				proInfoMain();
  265. 				/*微信分享*/
  266. 				$.ajax({
  267. 					url: "../ajax/weixin/jsapiTicket",
  268. 					type: 'get',
  269. 					dataType: 'json',
  270. 					contentType: "application/x-www-form-urlencoded; charset=utf-8",
  271. 					data: {
  272. 						'url': location.href.split('#')[0]
  273. 					},
  274. 					success: function(data) {
  275. 						if(data.data) {
  276. 							wx.config({
  277. 								debug: false, //调试模式好犀利
  278. 								appId: data.data.appId,
  279. 								timestamp: data.data.timestamp,
  280. 								nonceStr: data.data.nonceStr,
  281. 								signature: data.data.signature,
  282. 								jsApiList: [ // 所有要调用的 API 都要加到这个列表中
  283. 									"onMenuShareAppMessage",
  284. 									"onMenuShareTimeline",
  285. 									"onMenuShareQQ",
  286. 									"onMenuShareQZone",
  287. 									"scanQRCode",
  288. 								]
  289. 							});
  291. 							
  292. 							wx.ready(function() {
  293. 								// 在这里调用 API
  294. 								wx.onMenuShareAppMessage({ //分享给朋友
  295. 									title: shareTitle, // 分享标题
  296. 									desc: descContent, // 分享描述
  297. 									link: lineLink, // 分享链接
  298. 									imgUrl: imgUrl, // 分享图标
  299. 									success: share_success_callback,
  300. 									cancel: share_cancel_callback
  301. 								});
  303. 								wx.onMenuShareTimeline({ //分享到朋友圈
  304. 									title: shareTitle, // 分享标题
  305. 									desc: descContent, // 分享描述
  306. 									link: lineLink, // 分享链接
  307. 									imgUrl: imgUrl, // 分享图标
  308. 									success: share_success_callback,
  309. 									cancel: share_cancel_callback
  310. 								});
  312. 								wx.onMenuShareQQ({ //分享到QQ
  313. 									title: shareTitle, // 分享标题
  314. 									desc: descContent, // 分享描述
  315. 									link: lineLink, // 分享链接
  316. 									imgUrl: imgUrl, // 分享图标
  317. 									success: share_success_callback,
  318. 									cancel: share_cancel_callback
  319. 								});
  321. 								wx.onMenuShareQZone({ //分享到QQ空间
  322. 									title: shareTitle, // 分享标题
  323. 									desc: descContent, // 分享描述
  324. 									link: lineLink, // 分享链接
  325. 									imgUrl: imgUrl, // 分享图标
  326. 									success: share_success_callback,
  327. 									cancel: share_cancel_callback
  328. 								});
  330. 							});
  332. 							//分享成功后的回调函数	
  333. 							function share_success_callback() {}
  335. 							//用户取消分享后执行的回调函数	
  336. 							function share_cancel_callback() {}
  338. 						}
  340. 					}
  341. 				});
  343. 			})
  344. 		</script>
  345. 	</body>
  347. </html>