How can I detect non-functional pointer-events?

1.1k Views Asked by At

It says here that Opera 12 doesn't support pointer-events. And it is true, it breaks my website. The problem is that they do support the property in css, even if they don't seem to do the right thing with it. Feature detection in the form of Modernizr is useless in this case:

>>> Modernizr.testProp('pointerEvents')
true

jQuery.browser has been removed. What can I do to detect this corner case in my javascript code? Or to get Opera's version?

3

There are 3 best solutions below

0
On

Opera provides it's own easy way of grabbing a version. If you are certain that Opera

if (window.opera && parseInt(opera.version(), <== 12)) {
 //do the opera thing
}

will detect opera, less than or equal to 12

1
On

If you only want to detect whether pointer-events are enabled you could use the navigator property according to the W3C specification:

window.navigator.pointerEnabled

This gives back true for Opera 15 and above but it gives undefined for Opera 12 and below, which is what you want from what I understand.

0
On

Ok, here is my bad solution, I hope there be a better one... This is in typescript:

    ...
    public isBadOpera(): boolean
    {
        var isOpera = Object.prototype.toString.call(window['opera']) == '[object Opera]';
        if ( isOpera )
        {
            var opera: OperaVersion = window['opera'];
            var version_string = opera.version();
            var version_re = /(\d+).(\d+)/;
            var mo = version_re.exec(version_string);
            if ( mo )
            {
                var major_version = Number(mo[1]);
                if ( major_version <= 12)
                {
                    return true;
                }
            }
        }
        return false;
    }
    ...

interface Opera {
    version():string;
}