<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>微官ceo-分享到朋友圈demo</title>
<meta name="viewport" content="initial-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta charset="utf-8">
<!-- 加载分享css和js -->
<link href="css/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<!-- 加载分享样式 -->
<style>
a{text-decoration:none;}
.share_btn{ width:98%; margin:0 1%; text-align:center; margin-bottom:15px;}
.share_btn a{ width:45%; padding:10px 0;display:inline-block;color:#333; background:#fff; border:#dedede solid 1px; border-radius:5px; text-align:center;box-shadow:rgba(0,0,0,0.2) 0 0 2px;}
.shade{ background:#000;opacity:0.8; height:100%; width:100%; position:fixed; display:none; top:0; left:0; z-index:9999; }
.simg{ position:relative; z-index:9999; top:5px; width:100%;}
.close{ position:fixed; font-size:28px; color:#fff; z-index:10000; display:block; width:100%; height:100%; left:0; top:0;}
</style>
</head>
<body>
<!-- 分享标题和图片 -->
<div class="content">
<span class="marginb">
<h3>微官CEO-分享到朋友圈demo</h3>
<p>你好!我是微官CEO。</p><br />
<p>我是微信公众平台产品二次开发者,擅长微信公众平台产品需求分析、产品设计开发,完成的微信产品有微信墙、微网站、微网站建站系统等。</p><br />
<p><a href="http://epaas.net/app">微网站制作,微网站建站系统开发</a>,微网站优化 SEO 以及 微信公众帐号运营推广等业务合作,可联系01064400299</p>
</span>
<p class="share_btn">
<a href="javascript:;">发送给好友</a>
<a href="javascript:;">分享到朋友圈</a>
</p>
<hr />
<p>效果图:</p>
<img src="images/epaaslogo.jpg" alt="" width="287" height="478">
</div>
<div class="shade">
<img src="images/share.png" class="simg"/>
<a href="javascript:close_fx();" class="close"></a>
</div>
</body>
</html>
<script>
$(function(){
$(".share_btn a").click(function(){
$(".shade").fadeToggle(1000);
});
});
function fenxiang(){
$(".shade").fadeToggle();
}
function close_fx(){
$(".shade").fadeToggle();
}
</script>
- 1
- 2
前往页