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>