使用js检测用户是否在用微信浏览器浏览网站

  如今大部分的公司喜欢把本身发布的网址转成二维码,而后用户只要用手机扫一下就能登陆。而大部分的用户都喜欢(可能不知道还有其余扫码工具)用微信来扫二维码,你们都知道微信里面自带的浏览器会屏蔽大部分的外部网站,只能点击右上角图标,而后“点击在浏览器中打开”才行。因此咱们须要就要采起一些措施为了防止咱们的网站在用户用微信浏览器打开时被屏蔽,而致使用户不知道该怎么办(大部分的人都不知道)。css

  下面是判断用户是否在用微信浏览器的js浏览器

// 是不是微信浏览器
function is_weixin() {
    var ua = navigator.userAgent.toLowerCase();
    return ua.match(/MicroMessenger/i) == "micromessenger" ? true : false 
}

// 加载提示图片
function loadHtml() {
    var div = document.createElement('div');
    div.id = 'weixin-tip';
    div.innerHTML = '<p><img src="IMG_1185.PNG" alt="微信打开"/></p>';
    document.body.appendChild(div);
}

// 设置style
function loadStyleText(cssText) {
    var style = document.createElement('style');
    style.rel = 'stylesheet';
    style.type = 'text/css';
    try {
        style.appendChild(document.createTextNode(cssText));
    } catch (e) {
        style.styleSheet.cssText = cssText; //ie9如下
    }
    var head = document.getElementsByTagName("head")[0]; //head标签之间加上style样式
    head.appendChild(style);
}
//CSS样式
var cssText = "#weixin-tip{position: fixed; left:0; top:0; background: rgba(0,0,0,0.8); filter:alpha(opacity=80); width: 100%; height:100%; z-index: 100;} #weixin-tip p{text-align: center; margin-top: 10%; padding:0 5%;}";

if (is_weixin()) {
    loadHtml();
    loadStyleText(cssText);
}
IMG_1185.PNG 大概是内容大概以下:

 

红标题的后面还有一段白色说明文字,由于背景是白色全部看不到微信

相关文章
相关标签/搜索