https://blog.csdn.net/zgsdzczh/article/details/79744838
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>
还有另外一个参考案例:
file:///C:/Users/Administrator/Desktop/449/449/index.html