title: how to check if browser supports a specific css property
body: <p>I am trying to display a filter on an image based on browser support.</p>
  
  <p>How do I check if the browser supports a specific CSS property like filter and --webkit-filter using javascript?</p>
  
  <p>I am using the following function but its not working</p>
  
  <pre><code> isCSSStyleSupported: function(prop, value) {
              // If no value is supplied, use "inherit"
              value = arguments.length === 2 ? value : 'inherit';
              // Try the native standard method first
              if ('CSS' in window &amp;&amp; 'supports' in window.CSS) {
                  return window.CSS.supports(prop, value);
              }
              // Check Opera's native method
              if('supportsCSS' in window){
                  return window.supportsCSS(prop, value);
              }
              // Convert to camel-case for DOM interactions
              var camel = prop.replace(/-([a-z]|[0-9])/ig, function(all, letter) {
                  return (letter + '').toUpperCase();
              });
              // Check if the property is supported
              var support = (camel in el.style);
              // Create test element
              var el = document.createElement('div');
              // Assign the property and value to invoke
              // the CSS interpreter
              el.style.cssText = prop + ':' + value;
              // Ensure both the property and value are
              // supported and return
              return support &amp;&amp; (el.style[camel] !== '');
          },
  </code></pre>