隨著移動端瀏覽量占比大幅提升，如何打造一個自動識別屏幕尺寸的自適應網站，就變成了站長不得不解決的一個現實問題。網站自動識別手機端的方法有很多，但是對于新手來說很是復雜，而且調試起來很困難。下面麥布就教你一個很簡單的自動識別手機端并跳轉的響應式網站。
步驟一：進入百度開發者中心（http://siteapp.baidu.com/），利用siteapp來制作自己的手機網站，很簡單，都是模板式建站，會打字就行。
步驟二：綁定一個專屬webapp域名，例如：m.54admin.net，將您已提交的WebApp域名的CNAME解析到siteapp.baidu.com
步驟三：將自動識別手機端與PC端的代碼放置在你網站代碼的頂部位置。代碼如下：
<script type="text/javascript">
if(/AppleWebKit.*mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){
if(window.location.href.indexOf("?mobile")<0){
try{
if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){
window.location.href="http://m.54admin.net";
}else if(/iPad/i.test(navigator.userAgent)){
window.location.href="http://m.54admin.net";
}else{
window.location.href="http://www.54admin.net"
}
}catch(e){}
}
}
</script>
這樣就大功告成了，是不是很簡單呢？
歡迎關注麥布(微信/QQ號：330419081)，一起分享站長資源，探討網站運營推廣之道！ |
