直接在网上扒一个页面，分分钟搞定!  先看一下效果

这是用微信开发工具打开的样式，直接上完整代码

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1"/>

    <title>忆游APP下载</title>

</head>

<body>

    <style type="text/css">

    *{margin:0; padding:0;}

    img{max-width: 100%; height: auto;}

    .test{height: 600px; max-width: 600px; font-size: 40px;}

    </style>

    <script type="text/javascript">

        var img = 'android.png';

        function is_weixin() {

            var ua = navigator.userAgent.toLowerCase();

            if(ua.indexOf('iphone') > -1){

                    img = 'iphone.png';

            }else{

                    img = 'android.png';

            }

            if (ua.match(/MicroMessenger/i) == "micromessenger") {

                return true;

            } else {

                return false;

            }

        }

        var isWeixin = is_weixin();

        var winHeight = typeof window.innerHeight != 'undefined' ? window.innerHeight : document.documentElement.clientHeight;

        function loadHtml(){

            var div = document.createElement('div');

            div.id = 'weixin-tip';

            div.innerHTML = '<p><img src="'+ img +'" alt="微信打开"/></p>';

            document.body.appendChild(div);

        }

        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);

        }

        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(isWeixin){

            loadHtml();

            loadStyleText(cssText);

        }else{

                window.location.href="http://static.youliaoar.com/operation/yiyou/aryiyou1.1.0.apk";

        }

    </script>

</body>

</html>

微信在浏览器打开前的提示页面Android与IOS判断的更多相关文章

  1. 微信网页浏览器打开链接后跳转到其他浏览器下载APK文件包

    做微信营销活动或者APK下载推广时候,是无法直接下载,做到微信中正常使用呢?这就要借助一些工具来实现有效的操作. 安卓手机的话是通过点击链接,直接跳转出微信.自动打开手机默认的浏览器.但是这个方法IO ...

  2. 解决浏览器打开网页后提示“dns_probe_possible”的方法

    使用浏览器浏览网页时偶尔会遇到无法上网且浏览器提示:DNS_PROBE_POSSIBLE 一般有三种情况会导致这样的故障: 1.网络协议出现故障,也就是常说的 DNS 设置问题 2.浏览器中设置问题, ...

  3. HTML页面只能使用微信浏览器打开

    看到一个项目,刚开始还以为是APP,只能用微信打开.仔细看了下原来是个web项目,只是禁用了其他浏览器打开,只能用微信浏览器打开.加上前端页面用了类似mui的模板,就更像APP了. 百度了下,参考 h ...

  4. 【第二十篇】C#微信H5支付 非微信内浏览器H5支付 浏览器微信支付

    微信开发者文档 微信H5支付官方文档   请阅读清楚  最起码把所有参数看一遍 这个地方也可以看看 微信案例 http://wxpay.wxutil.com/mch/pay/h5.v2.php,请在微 ...

  5. 微信小程序web-view(webview) 嵌套H5页面 唤起微信支付的实现方案

    场景:小程序页面有一个web-view组件,组件嵌套的H5页面,要唤起微信支付. 先讲一下我的项目,首先我是自己开发的一个H5触屏版的商城系统,里面含有购物车,订单支付等功能.然后刚开始,我们公众号里 ...

  6. uni-app-在开启小程序在微信开发工具打开时，打开失败，解决方法：手动打开

    这是我自学ui-app的第一张记录内容,问题都是我在实际开发中遇到的问题 1.微信开发工具打开失败,提示是: 接着我的流程就是打开上面提到的链接,进入页面:https://developers.wei ...

  7. JS判断在哪一端浏览器打开

    <script src="js/jquery-2.2.3.min.js"></script> <script> var browser = { ...

  8. 微信中打开链接,自动打开外部浏览器打开指定URL页面

    上半年公司有一个新的APP项目上线,我们在项目首页做个二维码,然后用户用手机扫一扫就能下载了.但是很多用户反映扫一扫之后下载不了,了解之后才知道这些用户都是使用的微信的扫一扫,而我们开发测试人员一般使 ...

  9. 微信如何实现自动跳转到用其他浏览器打开指定页面下载APP

    不管是app的下载链接还是普通文件的链接在微信内置浏览器或者QQ内置浏览器都会被屏蔽.这是微信对第三方下载域名实施的拦截政策.被拦截了用户在微信内打开就会提示“已停止访问该网页”. 那么当我们遇到这个 ...

随机推荐

  1. JAVA多线程之Semaphore

    Semaphore:动态增减信号量,用于控制对某资源访问的同一时间的并发量.类似于令牌,谁拿到令牌(acquire)就可以去执行了,如果没有令牌则需要等待. [如何获取]:semaphore.tryA ...

  2. json数据前台解析 修改check属性用prop（）

    jQuery中的$.getJSON( )方法函数主要用来从服务器加载json编码的数据,它使用的是GET HTTP请求.使用方法如下: $.getJSON( url [, data ] [, succ ...

  3. Windows进程通信之一看就懂的匿名管道通信

    目录 进程通信之一看就懂的匿名管道通信 一丶匿名管道 1.1何为匿名管道 1.2创建匿名管道需要注意的事项 1.3 创建匿名管道需要的步骤 1.4代码例子 1.5代码运行截图 进程通信之一看就懂的匿名 ...

  4. SVN的搭建（入门篇）

    如果转载,请注明出处,谢谢 1.安装SVN # yum install subversion 2.创建一个仓库 创建一个仓库svnrepos # svnadmin create /usr/svnrep ...

  5. SpringBoot | 第十章：Swagger2的集成和使用

    前言 前一章节介绍了mybatisPlus的集成和简单使用,本章节开始接着上一章节的用户表,进行Swagger2的集成.现在都奉行前后端分离开发和微服务大行其道,分微服务及前后端分离后,前后端开发的沟 ...

  6. 使用Fsharp 探索 Dotnet 平台

    Fsharp的交互开发环境使得我们在了解DotNet平台时能够快速的获得需要的反馈. 反馈在任何技艺的磨练过程中必不可少,我认为也是最重要的环节之一.在“一万小时天才理论”中,著名的髓鞘质就是在快速有 ...

  7. DRF之视图组件

    不断的优化我们写的程序,是每个程序员必备的技能和职业素养,也是帮助我们成长的非常重要的手段. 使用serializer进行put接口设计 根据规范,PUT接口用来定义用户对数据修改的逻辑,也就是upd ...

  8. WPF样式学习三

    SnapsToDevicePixels 获取或设置在呈现过程,该值来确定呈现此元素是否应使用特定于设备的像素设置. 这是一个依赖项属性. true ,如果元素应以符合呈现到设备像素;否则, false ...

  9. 【Android开发笔记】程序崩溃异常总结

    广播注册相关(broadcastReceiver) 没有注册广播就注销广播 注册广播但未注销广播 注册广播后重复注销广播 解决办法: 添加一个布尔变量,注册广播后为true,若为true在执行注销,注 ...

  10. JFinal常量配置学习笔记

    在继承 JFinalConfig 类时,需要 实现 /** * Config constant */ public abstract void configConstant(Constants me) ...