做HTML5页面的时候，经常会有提示用户分享的需求，一张蒙层上面加一张提示用户去分享的图片，有的时候可能会有一些文字，下面这个例子就是最简单的，平常开发的时候，如果有更复杂的，可以在这个基础上做修改。
HTML代码：
<!-- 用来点击的按钮 -->
<div class="reviewbtn">
<a href="#" class="ashen_btn share">我要分享</a>
</div>
<!-- 用来显示的图片 -->
<div class="share_img">
</div>
<!-- 最底下的蒙层 -->
<div class="bg"></div>
CSS代码：
.share_img {
position: fixed;
top: 0;
right: 0;
z-index: 1;
display: none;
}
.share_img img {
width: 4.958333333333333rem;
height: 2.0555555555555554rem;
}
.bg {
background: rgba(0, 0, 0, 0.8);
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 0;
display: none;
}
JS代码：
<script type="text/javascript" src="js/jquery.js"></script>
$(document).ready(function() {
$(".share").on("click", function() {
$(".bg").show();
$(".share_img").show();
});
$(".bg").on("click", function() {
$(this).hide();
$(".share_img").hide();
});
});
