尊敬的社員,您好!歡迎您來到麥布網,請[注冊]或[登錄]

首頁 | 同城網站 | 麥布網摘 | 網站目錄 | 程序源碼 | 站長導航 | 站長工具 | 自動鏈接 |

 
 
當前位置:麥布首頁 -> 站長網志 -> 查看日志
教你打造自動識別PC端與移動端的響應式網站

2016-9-19 21:38:00 | MyBu


    隨著移動端瀏覽量占比大幅提升,如何打造一個自動識別屏幕尺寸的自適應網站,就變成了站長不得不解決的一個現實問題。網站自動識別手機端的方法有很多,但是對于新手來說很是復雜,而且調試起來很困難。下面麥布就教你一個很簡單的自動識別手機端并跳轉的響應式網站。
   
    步驟一:進入百度開發者中心(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),一起分享站長資源,探討網站運營推廣之道!



發表評論:歡迎對該文章發表你的看法。


還沒有任何評論

 共計 0 條評論 | 共: 頁 | 當前: 第 頁 當前只有一頁
 

    記錄麥布網站的發展歷程及使用技巧,請隨時關注黑板報!

::日志分類::

告示·網站的大小事務
手記·建站的心得體會
品網·品嘗互聯網之美
碎語·閑話互聯網之外


 
 
国标十三张麻将 绿色 福建快3推存号码 冰球突破官方网站 三肖中特期期哦黄大仙 (★^O^★)MG城市猎人_电子游艺 (★^O^★)MG超级888_破解版下载 内蒙古快三预测专家预测分析 (^ω^)MG电音歌后巨额大奖视频 互联网彩票停售原因之一是否是因为 南粤风采26选5走势图表 新疆25选7中奖程序 昨天福建快3开奖结果 私彩信誉平台十大网站 九龙内幕 (*^▽^*)MG疯狂维京海盗游戏规则 体彩6十1怎么看中奖 (*^▽^*)MG探陵人彩金