页面载入中...

阿奇娱乐网(www.aqiziyuan.cn)提供免费资源分享平台,做最绿色安全的免费辅助、软件、QQ技术、网络技术等精神而建立的网站

微信跳转浏览器或提示手机端打开HTML代码

发布:十月2018-11-9 9:12分类: 技术文章 关键词: 浏览:48字数:3244 去评论(0)

一些做微信营销活动者需要推广下载apk文件域名经常会红,也就是域名被封了,微信屏蔽访问了!

如图:


微信屏蔽原理主要应该有两条:

  1. 第一是系统自动检测
  2. 第二是微信工作人员人工检测
至于我们防止屏蔽通常也有两种方法:(通过屏蔽和监测一些腾讯监测IP。从而避免系统查杀。保证链接在微信QQ中一直可以直接打开。不用担心被封禁从而无法打开情况!!)1、弹框提示法,这种事最简单方法。方式如下图(适用于下载,违规网址打开

这个其实就是通过判断是否是微信浏览器实现,如果是微信浏览器就弹出模态框图片提示用户跳去浏览器

下面分享下邵先森使用代码:
 
  
  
 你标题 
    
  
 /*演示用,请勿引入项目中*/ 
 *{margin:0; padding: 0;} 
 body{font:normal 14px/1.5 Arial,Microsoft Yahei; color:#333;} 
 .example{padding: 20px;} 
 .example p{margin: 20px 0;} 
 a{display: inline-block; background: #61B3E6; color:#fff; padding: 0 15px; border-radius: 6px; text-align: center; 
 
  
 
margin: 0 8px; line-height: 25px; font-size: 20px; text-decoration: none;} 
 a.btn-warn{background: #F0AD4E;} 
 a:hover{opacity: 0.8;} 
 /*核心css*/ 
  .wxtip{background: rgba(0,0,0,0.8); text-align: center; position: fixed; left:0; top: 0; width: 100%; 
 
  
 
height: 100%; z-index: 998; display: none;} 
  .wxtip-icon{width: 52px; height: 67px; background: url(http://img.caibaojian.com/uploads/2016/01/weixin- 
 
  
 
tip.png) no-repeat; display: block; position: absolute; right: 30px; top: 20px;} 
  .wxtip-txt{padding-top: 107px; color: #fff; font-size: 16px; line-height: 1.5;}
网站经营业务 网站经营业务 欢迎来到泽以自助下单业务平台-用心创造快乐 微信官方屏蔽,请用手机浏览器访问,谢谢! 点击进入①号下单平台 点击进入②号下单平台
微信跳转图片

点击右上角选择在浏览器打开

function weixinTip(ele){ var ua = navigator.userAgent; var isWeixin = !!/MicroMessenger/i.test(ua); if(isWeixin){ ele.onclick=function(e){ window.event? window.event.returnValue = false : e.preventDefault(); document.getElementById('JweixinTip').style.display='block'; } document.getElementById('JweixinTip').onclick=function(){ this.style.display='none'; } } } var btn1 = document.getElementById('YUEZEYI1');//1 weixinTip(btn1); var btn2 = document.getElementById('YUEZEYI2'); //2 weixinTip(btn2);
判断那种系统而强制手机打开

这种方法不仅可以实现微信打开提示使用手机默认浏览器而且会判断是那种系统而去强制某种系统打开

下面代码转自大傻逼-原文连接:https://www.cnblogs.com/s-b-b/p/5822819.html

实现思路:

1.在页面加载时候去判断是否在微信浏览器里面,如果是就弹出模态框图片提示用户跳去浏览器下载

var ua = navigator.userAgent.toLowerCase();//获取判断用对象 if (ua.match(/MicroMessenger/i) == "micromessenger") { // 弹出模态框提示用户  document.getElementById('download-modal').style.visibility = "visible";
            }

2.判断是否哪种系统android,ios)


最后附上源代码// 判断系统客户端 var u = navigator.userAgent; var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端  var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端  if(isAndroid == true){ // alert('Android!'); window.location = 'android.apk';
            } else { if(isiOS == true){ // alert('ios!'); window.location = 'https://itunes.apple.com/';
                }else{
                    alert('请在手机打开');
                }
            }

最后附上源代码


 <script type="text/javascript"> 
        function down(){ 
            // 判断是否微信浏览器 
            var ua = navigator.userAgent.toLowerCase();//获取判断用对象 
            if (ua.match(/MicroMessenger/i) == "micromessenger") { 
                // 弹出模态框提示用户  
                 document.getElementById('download-modal').style.visibility = "visible"; 
            }else{ 
                // 判断系统客户端 
                var u = navigator.userAgent;  
                var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端  
                var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端  
                if(isAndroid == true){ 
                    // alert('Android!'); 
                    window.location = 'litme.apk'; 
                } 
                else { 
                    if(isiOS == true){ 
                        // alert('ios!'); 
                        window.location = 'https://itunes.apple.com/'; 
                    }else{ 
                        alert('请在手机打开'); 
                    } 
                } 
            } 
             
        } 
        function closeModal(){ 
            var modal = document.getElementById('download-modal'); 
            modal.style.visibility = "hidden"; 
        } 
     
     
        .download-modal{ 
            visibility: hidden; 
            width: 100%; 
            height: 100%; 
            opacity: 0.5; 
            position: absolute; 
            text-align: center; 
            background-color:rgb(30,30,30);  
            top: 0; 
            left: 0; 
            z-index: 9.99; 
        } 
        .download-modal-mess{ 
             
        } 
        #jump-to-browser{ 
            width: 90%; 
        } 
     
 
 
    

正文到此结束

阿奇资源网

1  除非特别注明,文章均为提供免费资源分享平台 - 阿奇资源网原创,转载时请注明来源

2 <本站资源来自互联网搜集,如有侵权请联系我们删除>

[点击提交]

3  本文标题:【微信跳转浏览器或提示手机端打开HTML代码】
4  本文衔接:http://www.aqiziyuan.cn/?post=1617  [点击加站长交流群]
 
相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注