微信、QQ中提示浏览器中打开

  • A+
所属分类:技术文章
微信、QQ中提示浏览器中打开

演示图片为xiuno论坛,如果制作成插件,可以把代码保存到 "plugin/插件目录名/hook/index_js.htm"

<script type="text/javascript">
    //判断访问终端
    window.onload = function () {
        var u = navigator.userAgent;
        switch (true) {
            case u.indexOf('qq') > -1:
                $('.icroMessengerTips').show();
                break;
            case u.indexOf('MicroMessenger') > -1:
                $('.icroMessengerTips').show();
                break;
        }
    };
</script>
<style>
    .icroMessengerTips{
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 99;
        background-color: rgba(0,0,0,.6);
    }
    .icroMessengerTips span{
        width: 25px;
        height: 25px;
        font-size: 18px;
        text-align: center;
        border-radius: 50%;
        background-color: yellow;
        display: block;
    }
    .icroMessengerTips strong{
        color: white;
        margin-left: 3px;
    }
    .icroMessengerTips:before{
        content: '';
        position: absolute;
        top: 2.23rem;
        right: 2.17rem;
        width: 7.03rem;
        height: 10.3rem;
        background-image: url(//assets.dxycdn.com/gitrepo/ncov-mobile/dist/static/icon-pilot@2x.37b07556.png);
        background-size: 100% 100%;
    }
    .wrap{
        list-style: none;
        position: absolute;
        right: 58px;
        top: 153px;
    }
    .wrap>li{
        display: flex;
        margin: 12px;
    }
</style>
<div class="icroMessengerTips" style="display: none">
    <ul class="wrap">
        <li><span>1</span><strong>右击右上角</strong></li>
        <li><span>2</span><strong>选择在浏览器<i class="icon icon-safari"></i>中打开</strong></li>
    </ul>
</div>

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: