正确的方法使用Modernizr来检测IE？ [英] Correct way to use Modernizr to detect IE?

问题描述

这可能是一个愚蠢的问题，但我想使用Modernizr JS库来检测某些浏览器属性，以确定要显示或不显示的内容。

我有一个名为 Pano2VR 的应用程序，它输出HTML5和SWF。我需要iOS设备用户的HTML5。

然而，IE根本不渲染这个HTML5输出。看来他们的输出使用CSS3 3D变换和WebGL，一个或多个显然不支持在IE9。

所以，对于那些用户，我需要显示Flash版本。我计划使用IFRAME，并通过Modernizr脚本或document.write正确的IFRAME代码根据浏览器传递SRC。

所有这些都导致了我使用Modernizr来检测简单的IE或不是IE？或检测CSS 3d变换？

还是有其他方法吗？

解决方案

Modernizr没有检测到浏览器本身，它检测到哪些功能和能力存在，这是整个想要做的事情。

您可以尝试在简单的检测脚本这样，然后使用它来做出你的选择。我还包括版本检测，以防万一需要。如果你只想检查任何版本的IE，你只需要找到值为MSIE的navigator.userAgent。

  var BrowserDetect = {init：function（）{this.browser = this.searchString（this.dataBrowser）|| 其他; this.version = this.searchVersion（navigator.userAgent）|| this.searchVersion（navigator.appVersion）|| 未知; }，searchString：function（data）{for（var i = 0; i  
 

然后，您可以检查：

  BrowserDetect.browser =='Explorer'; 
 BrowserDetect.version< = 9; 
  

This might be a stupid question, but I wanted to use the Modernizr JS library to detect for some browser properties to determine what content to show or not show.

I have an app called Pano2VR which outputs both HTML5 and SWF. I need the HTML5 for iOS device users.

However, IE does not render this "HTML5" output at all. It seems their output uses CSS3 3D transforms and WebGL, one or more apparently unsupported in IE9.

So, for those users I need to display the Flash version. I was planning to use an IFRAME and either pass the SRC via a Modernizr script or document.write out the correct IFRAME code depending on browser.

All of which leads to how do I use Modernizr to detect simply IE or not IE? Or detect for CSS 3d transforms?

Or is there another way to do this?

解决方案

Modernizr doesn't detect browsers as such, it detects which feature and capability are present and this is the whole jist of what it's trying to do.

You could try hooking in a simple detection script like this and then using it to make your choice. I've included Version Detection as well just in case that's needed. If you only want to check of any version of IE you could just look for the navigator.userAgent having a value of "MSIE".

var BrowserDetect = {
        init: function () {
            this.browser = this.searchString(this.dataBrowser) || "Other";
            this.version = this.searchVersion(navigator.userAgent) || this.searchVersion(navigator.appVersion) || "Unknown";
        },
        searchString: function (data) {
            for (var i = 0; i < data.length; i++) {
                var dataString = data[i].string;
                this.versionSearchString = data[i].subString;

                if (dataString.indexOf(data[i].subString) !== -1) {
                    return data[i].identity;
                }
            }
        },
        searchVersion: function (dataString) {
            var index = dataString.indexOf(this.versionSearchString);
            if (index === -1) {
                return;
            }

            var rv = dataString.indexOf("rv:");
            if (this.versionSearchString === "Trident" && rv !== -1) {
                return parseFloat(dataString.substring(rv + 3));
            } else {
                return parseFloat(dataString.substring(index + this.versionSearchString.length + 1));
            }
        },

        dataBrowser: [
            {string: navigator.userAgent, subString: "Edge", identity: "MS Edge"},
            {string: navigator.userAgent, subString: "MSIE", identity: "Explorer"},
            {string: navigator.userAgent, subString: "Trident", identity: "Explorer"},
            {string: navigator.userAgent, subString: "Firefox", identity: "Firefox"},
            {string: navigator.userAgent, subString: "Opera", identity: "Opera"},  
            {string: navigator.userAgent, subString: "OPR", identity: "Opera"},  

            {string: navigator.userAgent, subString: "Chrome", identity: "Chrome"}, 
            {string: navigator.userAgent, subString: "Safari", identity: "Safari"}       
        ]
    };
    
    BrowserDetect.init();
    document.write("You are using <b>" + BrowserDetect.browser + "</b> with version <b>" + BrowserDetect.version + "</b>");

You can then simply check for:

BrowserDetect.browser == 'Explorer';
BrowserDetect.version <= 9;

这篇关于正确的方法使用Modernizr来检测IE？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！