A-A+

PHP判断网站是否手机版进行跳转

2015年05月22日 编程技术 暂无评论

最近在搞手机的微官网,这里小小的说明一下,其实微官网就是将手机版的网站在微信里面做了一个“微官网”的链接,可以使其在微信公众号里面打开,这样就形成了微官网,也就是我们只要制作一个手机版的网站,然后再申请一个微信公众号,在里面就可以进行链接这个手机版的网站,这样我们就有了手机版网站+微官网了,呵呵,小虎博客在制作了电脑版和手机版两个版本的站点时,需要进行客户端的判断,也就是如果是电脑打开,则显示电脑版网站,如果是手机客户端打开则显示手机版的网站。

实现这样的要求其实不难,网上的跳转代码很多,就是作了一个 js 的判断,首先判断客户端是手机还是电脑,然后作相应的跳转,下面是一段JS的跳转代码:

  1. <script>  
  2.     var pc_style = ""  
  3.     var browser = {  
  4.     versions: function () {  
  5.     var u = navigator.userAgent, app = navigator.appVersion;  
  6.     return {  
  7.     trident: u.indexOf('Trident') > -1,  
  8.     presto: u.indexOf('Presto') > -1,  
  9.     webKit: u.indexOf('AppleWebKit') > -1,  
  10.     gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,  
  11.     mobile: !!u.match(/AppleWebKit.*Mobile.*/) || !!u.match(/AppleWebKit/) && u.indexOf('QIHU') && u.indexOf('Chrome') < 0,  
  12.     ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),  
  13.     android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1,  
  14.     iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1,  
  15.     iPad: u.indexOf('iPad') > -1,  
  16.     webApp: u.indexOf('Safari') == -1,  
  17.     ua: u  
  18.     };  
  19.     }(),  
  20.     language: (navigator.browserLanguage || navigator.language).toLowerCase()  
  21.     }  
  22.   
  23.     if (browser.versions.mobile && !browser.versions.iPad) {  
  24.     this.location = "https://www.xiaohuboke.com/";  
  25.     /*微官网地址*/  
  26.     }  
  27. </script>  

将这段代码放到网站 head 代码之间就可以了,在用手机浏览的时候会自动跳转到“微官网地址”,也就是手机版的地址了。

题外话:话说现在的自适应设计已经很流行了,最好在设计站点的时候使用自适应的页面,但这种技术要求较高,如果做不了自适应效果,就只能制作两个版本的站点来进行判断跳转了。

标签:

给我留言