3

In my web-app I am using a transparent blur filter to overlay on top of a video. This is doable with all browsers except IE10/11. Since the blur filter is a CSS property, I can't really do proper feature detection, as I should be doing. Instead, I am using this:

if(navigator.userAgent.indexOf("Trident")>-1) { // IE ... }

If IE is detected, I use a different filter (non-blur) that works there.

Is there any situation in which this code might give a false positive? Are there any blur-compatible browsers that use the Trident engine?

Edit: I know IE8 and IE9 have their own blur filters, but for consistency's sake, we decided to use the same alternative filter for all versions of IE.

sg.cc
  • 1,726
  • 19
  • 41
  • 1
    I believe you can use http://modernizr.com/ to check for CSS filters support – Yuriy Galanter Feb 10 '14 at 20:18
  • I agree in principle with Yuriy, that modernizr (or the approach of testing for that feature) makes more sense then checking against the UA. However, loading modernizr, just to test for the blur filter may be overkill (especially if you're not using it in your current project). Did you consider a test like: if(document.documentElement.style.msFilter) ... (msFilter, webkitFilter, etc.) // Do something – Jack Feb 10 '14 at 20:28
  • Thanks for the comment, Jack! So, according to your answer, it is possible to detect whether specific styles are available in the current browser using Javascript? Please elaborate if it is so, I would definitely prefer using feature detection over gross browser detection. Edit: No, I am not using modernizr. Blur is the only browser-dependent feature I am trying to keep track of, so yes, loading it would be too much. – sg.cc Feb 10 '14 at 20:41

2 Answers2

5

This page explains the user agent strings used by Internet explorer:

http://msdn.microsoft.com/library/ms537503.aspx

It says that the Trident token was only introduced in IE8, so you might want to check for "MSIE" instead or as well.

There is also this page:

http://msdn.microsoft.com/en-US/library/ms537509.aspx

which is "archived and is no longer actively maintained" but does include a lot of useful information on detecting Internet Explorer.

matthewk
  • 1,841
  • 17
  • 31
0

You can detect filter support, as described in the answer to this question: How can I feature-detect CSS filters?

Community
  • 1
  • 1
matthewk
  • 1,841
  • 17
  • 31
  • Depending on the system, the filter might be a CSS filter, or it might be an SVG filter (javascript-determined). Some browsers (IE & Opera), although allowing SVG filters, don't allow them to filter non-SVG content. This doesn't really answer the question I asked. – sg.cc Feb 11 '14 at 00:53