老旧浏览器弹窗提醒

前言

在今年IE终于从半身入土到彻底寄寄，谷歌也做了个违背祖宗的决定，版本号破百。但像夸克、UC、百分等浏览器，仍然用着老旧的谷歌内核，也有不少人还用着老版本的谷歌浏览器、Edge。像我学校的机房，仍用着老旧的44版Edge。

老旧的浏览器不仅让兼容性较低的网站样式爆炸（没错，说的就是我站（bushi）），更不是大势所趋。样式爆炸也会给访客留下不好的印象，为了避免这种情况，合理甩锅（嗯对没错）给浏览器非常双赢。可以每天检测一次浏览器版本号然后弹窗。

实现

把这JS找个地方塞进去，弹窗调用butterfly自带的，用其它的替换即可。

function browserTC() {
    btf.snackbarShow("");
    Snackbar.show({
        text: '浏览器版本较低，网站样式可能错乱',
        actionText: '关闭',
        duration: '6000',
        pos: 'bottom-right'
    });
}
function browserVersion() {
    var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
    var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器
    var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
    var isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //Edge浏览器
    var isFirefox = userAgent.indexOf("Firefox") > -1; //Firefox浏览器
    var isOpera = userAgent.indexOf("Opera")>-1 || userAgent.indexOf("OPR")>-1 ; //Opera浏览器
    var isChrome = userAgent.indexOf("Chrome")>-1 && userAgent.indexOf("Safari")>-1 && userAgent.indexOf("Edge")==-1 && userAgent.indexOf("OPR")==-1; //Chrome浏览器
    var isSafari = userAgent.indexOf("Safari")>-1 && userAgent.indexOf("Chrome")==-1 && userAgent.indexOf("Edge")==-1 && userAgent.indexOf("OPR")==-1; //Safari浏览器
    if(isEdge) {
        if(userAgent.split('Edge/')[1].split('.')[0]<90){
            browserTC()
        }
    } else if(isFirefox) {
        if(userAgent.split('Firefox/')[1].split('.')[0]<90){
            browserTC()
        }
    } else if(isOpera) {
        if(userAgent.split('OPR/')[1].split('.')[0]<80){
            browserTC()
        }
    } else if(isChrome) {
        if(userAgent.split('Chrome/')[1].split('.')[0]<90){
            browserTC()
        }
    } else if(isSafari) {
        //不知道Safari哪个版本是该淘汰的老旧版本
    }
}
//2022-10-29修正了一个错误：过期时间应使用toGMTString()，而不是toUTCString()，否则实际过期时间在中国差了8小时
function setCookies(obj, limitTime) {
  let data = new Date(new Date().getTime() + limitTime * 24 * 60 * 60 * 1000).toGMTString()
  for (let i in obj) {
    document.cookie = i + '=' + obj[i] + ';expires=' + data
  }
}
function getCookie(name) {
  var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
  if (arr = document.cookie.match(reg))
    return unescape(arr[2]);
  else
    return null;
}
if(getCookie('browsertc')!=1){
    setCookies({
        browsertc: 1,
    }, 1);
    browserVersion();
}

后记

样式爆炸首先甩锅（

轻笑Chuckle

老旧浏览器弹窗提醒

文章目录

前言

实现

后记

评论

站点