web页在微信中访问增加遮罩层 右上角弹出在浏览器中打开

web页在微信中访问增加遮罩层 右上角弹出在浏览器中打开

<style type="text/css">
* {
	margin: 0;
	padding: 0;
}

a {
	text-decoration: none;
}

img {
	max-width: 100%;
	height: auto;
}

.weixin-tip {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.8);
	filter: alpha(opacity = 80);
	height: 100%;
	width: 100%;
	z-index: 100;
}

.weixin-tip p {
	text-align: center;
	margin-top: 10%;
	padding: 0 5%;
}
</style>

	<div class="weixin-tip">
		<p>
			<img src="images/tip.png" alt="在浏览器打开" />
		</p>
	</div>

<script>
	$(window).on("load", function() {
		var winHeight = $(window).height();
		function is_weixin() {
			var ua = navigator.userAgent.toLowerCase();
			if (ua.match(/MicroMessenger/i) == "micromessenger") {
				return true;
			} else {
				return false;
			}
		}
		var isWeixin = is_weixin();
		if (isWeixin) {
			$(".weixin-tip").css("height", winHeight);
			$(".weixin-tip").show();
		}
	})
</script>

DEMO下载地址