Question

Is there any reliable method to detect if the browser supports position fixed?

I’ve found some solutions but none of them seems to work well on all browsers.

Answer 1

While developing a mobile application with jQuery Mobile I had the same problem. The headers should have fixed position (if supported by the browser) and the solution was to set the headers with a default position: fixed on the css and checked the supported property through the following method:

function isPositionFixedSupported() {
    return $( '[data-role="header"]' ).css( 'position' ) === 'fixed';
}

The returned value is static if not supported by the browser.