Chinaunix首页 | 论坛 | 博客

Chaser's blogzhuzusong.blog.chinaunix.net

首页　| 　博文目录　| 　关于我

zhuzusong

  • 博客访问： 954967
  • 博文数量： 80
  • 博客积分： 2380
  • 博客等级： 大尉
  • 技术积分： 1049
  • 用 户 组： 普通用户
  • 注册时间： 2010-04-14 11:06
个人简介

Only to find a successful way, not to find excuses for failure!

文章分类

全部博文（80）

文章存档

2016年（2）

2015年（4）

2014年（10）

2013年（10）

2012年（7）

2011年（17）

2010年（30）

我的朋友
最近访客
推荐博文
基于javascript实现判断移动终端浏览器版本信息

分类： JavaScript

2015-05-18 12:15:04


点击(此处)折叠或打开

  1. or_app.html

  3. <!DOCTYPE HTML>
  4. <html lang="zh-CN">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <title>偶然-陌生人交友,手机APP下载页</title>
  8.     <script type="text/javascript">
  9.         // 获取终端的相关信息
  10.          /*
  11.              * 智能机浏览器版本信息:
  12.              *
  13.              */
  14.             var browser = {
  15.                 versions: function() {
  16.                     var u = navigator.userAgent + navigator.appVersion;
  17.                     return {//移动终端浏览器版本信息
  18.                         trident: u.indexOf('Trident') > -1, //IE内核
  19.                         presto: u.indexOf('Presto') > -1, //opera内核
  20.                         webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
  21.                         gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
  22.                         mobile: !!u.match(/AppleWebKit.*Mobile.*/) || !!u.match(/AppleWebKit/), //是否为移动终端
  23.                         ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
  24.                         android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
  25.                         iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否为iPhone或者QQHD浏览器
  26.                         iPad: u.indexOf('iPad') > -1, //是否iPad
  27.                         webApp: u.indexOf('Safari') == -1 //是否web应该程序，没有头部与底部
  28.                     };
  29.                 }(),
  30.                 language: (navigator.browserLanguage || navigator.language).toLowerCase()
  31.             }
  32.  
  33.             if (browser.versions.ios || browser.versions.iPhone || browser.versions.iPad) {
  34.                 window.location="";
  35.             }
  36.             else if (browser.versions.android) {
  37.                 window.location="or_andrapp.html";
  38.             }
  39.                         else
  40.                         {
  41.                                 window.location="or_index.html";
  42.                                 }
  43.     </script>
  44. </head>
  45. <body>
  46.         请在浏览器中打开
  47.     
  48. </body>
  49. </html>

  51. or_andrapp.html

  53. <!DOCTYPE html>
  54. <html lang="en">
  55. <head>
  56.         <meta charset="UTF-8">
  57.         <meta name="viewport" content="width=device-width, initial-scale=1"/>
  58.         <title>偶然手机端下载</title>
  59. </head>
  60. <body>
  61.         <style type="text/css">
  62.         *{margin:0; padding:0;}
  63.         img{max-width: 100%; height: auto;}
  64.         .test{height: 400px; max-width: 500px; font-size: 20px; }
  65.         .test a {width:260px; background:#51adee; display:block; color:#fff; padding:5px 8px ; margin:50% auto 0; text-align:center; text-decoration:none}
  66.         </style>
  67.         <div class="test"><a href="%2FOuran.apk#weixin.qq.com#wechat_redirect ">偶然Android手机端下载</a></div>
  68.         <script type="text/javascript" src=""></script>
  69.         <script type="text/javascript">
  70.                 function is_weixin() {
  71.                     var ua = navigator.userAgent.toLowerCase();
  72.                     if (ua.match(/MicroMessenger/i) == "micromessenger") {
  73.                         return true;
  74.                     } else {
  75.                         return false;
  76.                     }
  77.                 }
  78.                 var isWeixin = is_weixin();
  79.                 var winHeight = typeof window.innerHeight != 'undefined' ? window.innerHeight : document.documentElement.clientHeight;
  80.                 
  81.                 //在这里添加最后一行

  83.                 if(isWeixin){
  84.                         $("body").append(weixinTip);
  85.                 }
  86.                 $("#weixinTip").css({
  87.                         "position":"fixed",
  88.                         "left":"0",
  89.                         "top":"0",
  90.                         "height":winHeight,
  91.                         "width":"100%",
  92.                         "z-index":"1000",
  93.                         "background-color":"rgba(0,0,0,0.8)",
  94.                         "filter":"alpha(opacity=80)",
  95.                 });
  96.                 $("#weixinTip p").css({
  97.                         "text-align":"center",
  98.                         "margin-top":"20%",
  99.                         "padding-left":"5%",
  100.                         "padding-right":"5%"
  101.                 });
  102.         </script>
  103. </body>
  104. </html>
var weixinTip = $('

微信打开

');  //添加到上面标注的地方
阅读(2611) | 评论(0) | 转发(0) |
0

上一篇：Zabbix监控基本搭建

下一篇：查看MYSQL数据库中所有用户及拥有权限

给主人留下些什么吧！~~
关于我们 | 关于IT168 | 联系方式 | 广告合作 | 法律声明 | 免费注册

Copyright 2001-2010 ChinaUnix.net All Rights Reserved 北京皓辰网域网络信息技术有限公司. 版权所有

感谢所有关心和支持过ChinaUnix的朋友们

16024965号-6