
macOS Catalina 10.15.1のpyenv環境でtkinterを利用するための設定(python 3.7.x系)
2019.11.13

MacにNode.jsのバージョンマネージャnodenvを導入する覚書
2019.02.03

MacでPython3 pyperclipを利用する際に日本語のコピペができない時の対処法
2019.01.15
Category WEB Tips Update 2015.07.03
レスポンシブWEBデザインによりUA(User agent)判別がより細かく指定してあげないと、
思わぬところで表示が崩れたりするケースが出てきました。
さらにWindows IEをどこまで対応させるかで構築時の工数がだいぶ変わるので、
どこかで線引きをしなければなりません。
そこで大きく分けると
・タブレット
・スマホ
・Old Internet Internet Explorer
・それ以外のブラウザ
とおおまかに4タイプに分ける事にしています。
そこで最近使用しているJQueryによる機種判別方法をまとめてみました。
下記を記述しています。
var _ua = (function(u){ return { Tablet:u.indexOf("ipad") != -1 || (u.indexOf("android") != -1 && u.indexOf("mobile") == -1) || (u.indexOf("firefox") != -1 && u.indexOf("tablet") != -1) || u.indexOf("kindle") != -1 || u.indexOf("silk") != -1 || u.indexOf("playbook") != -1, Mobile:(u.indexOf("windows") != -1 && u.indexOf("phone") != -1) || u.indexOf("iphone") != -1 || u.indexOf("ipod") != -1 || (u.indexOf("android") != -1 && u.indexOf("mobile") != -1) || (u.indexOf("firefox") != -1 && u.indexOf("mobile") != -1) || u.indexOf("blackberry") != -1, IE:u.indexOf('msie') != -1 || u.indexOf('trident') != -1 } })(window.navigator.userAgent.toLowerCase()); var _ap = (function(ap){ return { OldIE: ap.indexOf("msie 6.") != -1 || ap.indexOf("msie 7.") != -1 || ap.indexOf("msie 8.") != -1 || ap.indexOf("msie 9.") != -1 } })(window.navigator.appVersion.toLowerCase()); if(_ua.Mobile){ //Mobile var ua_num = 3; }else if(_ua.Tablet){ //Tablet var ua_num = 2; }else if(_ua.IE && _ap.OldIE){ //OLD IE var ua_num = 1; }else{ var ua_num = 0; }
各UserAgentを取得し、Tablet、Mobile、IEに振り分けています。
各IEのappVersionを取得し、各バージョンに振分けています。
各デバイスに変数ua_numにて番号を割り振っています。
スマホ : 3
タブレット : 2
Old IE : 1
それ以外 : 0
スマホのみに適用したい場合は
if(ua_num == 3){ //処理 }else{ //それ以外の処理 };
という感じで個別に指定する事ができます。
Old IE を含むPCに指定したいという場合は
if(ua_num <= 1){ //PCのみ処理 }else{ //それ以外の処理 };
という感じで指定する事ができます。