網站移動版本開發踩坑實錄四

標籤：os   io   re   c   問題   cti   html   代碼   

前戲：暈暈乎乎正在瞌睡中，測試妹紙拿來一個ipad，開著微博，開啟了網站說你看，微博內建瀏覽器點擊放大以後網頁沒有自適應啊（網站由於有圖片神馬的，全站圖片要自適應各種行動裝置），我驚醒，心想我草這是啥功能， 我這種木有ipad的人什麼時候看見過這個功能。

好吧既然出問題了，就開始想想吧---繼續昏迷10分鐘....

開始：拿著ipad上大概看了一下，當微博開啟的時候，其實頁面還是有一點冗餘的空白寬度，既然做了一個80%（估計）的可視展示地區，但是還是能有用移動留出空白，然後點擊放大，頁面平鋪這個視窗，第一想法一定是沒調起我的重繪代碼， 但是自己體驗一下那個展示地區，感覺也不需要調起來（我重新調整頁面，監聽的是第一頁面旋轉，否則resize）所以resize沒有綁定過事件，既然只是ipad上的微博是這樣，就先確認一下ipad 微博的的useragent吧，看了一下竟然吃果果的有 一個 Mozilla/5.0 (iPad; CPU OS 5_1_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Mobile/9B206 iPad1,1__weibo__3.5.1__ipad__os5.1.1吼吼那就是你了

var iPad = navigator.userAgent.toLowerCase().match(/iPad/i);   var isIpadWeibo = null;if(iPad) {    var isIpadWeibo = navigator.userAgent.toLowerCase().match(/_weibo_/i);}

所以只要判斷是isIpadWeibo 那麼我就把事件綁定一次算了

if(isIpadWeibo) {    $(window).on(‘resize‘, function() {        //js調整圖片自適應代碼    }); }

問題解決。