jQueryによるブラウザ判定

jQueryでブラウザ判定するコード
非推奨のjQuery.browserは使わない



サンプル

/*
 * jQuery addClass every browser.
 * Version 1.0  (31/01/2012) by Luvsic.
 * Version 1.1  (00/00/2012) by .
 *
 * Examples at: http://luvsic.net/item/154/
 * Copyright (c) Luvsic.
 */


jQuery(function(){
        if(jQuery.support.checkOn && jQuery.support.noCloneEvent && window.globalStorage) {
                $('html').addClass('ff');
        } else if(jQuery.support.checkOn  && jQuery.support.noCloneEvent && !jQuery.support.noCloneChecked && !jQuery.support.cors) {
                $('html').addClass('ie9');
        }
        else if(jQuery.support.checkOn && jQuery.support.noCloneEvent && !window.globalStorage && !jQuery.support.cors) {
                $('html').addClass('opera');
        }
        else if(jQuery.support.checkOn && jQuery.support.noCloneEvent && !window.globalStorage) {
                $('html').addClass('chrome');
        }
        else if(!jQuery.support.checkOn && jQuery.support.noCloneEvent) {
                $('html').addClass('safari');
        }
        else if(!jQuery.support.opacity) {
                if(!jQuery.support.style) {
                        if (typeof document.documentElement.style.maxHeight != 'undefined') {
                                $('html').addClass('ie7');
                        } else {
                                $('html').addClass('ie6');
                        }
                } else {
                        $('html').addClass('ie8');
                }
        } else {
                $('html').addClass('unknown-browser');
        }
});

IE以外のブラウザがバージョンアップによって判定できなくなる可能性がネックなので、IE判定部分だけ切り出して使うほうが良いのかもしれない、別適用するCSSを書く対象ブラウザによってちょっと考える必要がある。

IE6/7/8のみの判定

jQuery(function(){
        if(!jQuery.support.opacity) {
                if(!jQuery.support.style) {
                        if (typeof document.documentElement.style.maxHeight != 'undefined') {
                                $('html').addClass('ie7');
                        } else {
                                $('html').addClass('ie6');
                        }
                } else {
                        $('html').addClass('ie8');
                }
        }
});

オリジナルはjQuery.supportでのブラウザ判別 - W3G Blog Tools/Tipsでのnemonemo2010さんのコメントより。

Skooler Records

No comments yet

%3c%69%6e%70%75%74%20%74%79%70%65%3d%22%68%69%64%64%65%6e%22%20%6e%61%6d%65%3d%22%6e%70%5f%70%72%6f%74%65%63%74%62%79%6d%64%35%22%20%76%61%6c%75%65%3d%22%66%39%63%35%39%39%31%62%65%61%36%30%33%30%36%30%66%36%66%30%63%62%32%66%63%62%33%61%64%38%32%64%22%3e %3c%69%6e%70%75%74%20%74%79%70%65%3d%22%68%69%64%64%65%6e%22%20%6e%61%6d%65%3d%22%6e%70%5f%70%72%6f%74%65%63%74%62%79%6d%64%35%5f%68%61%73%68%22%20%76%61%6c%75%65%3d%22%36%35%31%64%32%31%36%34%65%33%38%63%30%39%30%64%38%63%32%33%38%61%61%63%65%31%33%66%61%34%32%37%22%3e
© 2006 – 2018 by Luvsic. Some rights reserved.