
MacのVSCode(VisualStudioCode)のClineでOllamaが動作しない時の解決備忘録
2024.11.13

WordPressでメディアのサムネイルを一括で再生成するプラグイン『Regenerate Thumbnails』
2023.09.23

MacでOpen Interpreterをローカルで動かした際に、CodeLlama Modelがダウンロードされる場所
2023.09.09
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{ //それ以外の処理 };
という感じで指定する事ができます。