feature detection firefox quirk with title attributes not showing on disabled elements

Question

How would I go about using feature detection to find out whether I need to emulate the title attribute on disabled input elements.

I'm aware that firefox claims & interprets the specification so that it is working as intended but I would none the less like tooltips to display.

The only thing I can think of is using browser detection directly.

an example of the issue can be seen here http://jsfiddle.net/Raynos/xQyBR/

var con = $("#Con");

var b1 = $("<input>").attr({
    "id": "b1",
    "title": "Some Other Text",
    "type": "button",
    "value": "b1"  
}).appendTo(con);

con.append($("<br>"));

var b2 = $("<input>").attr({
    "id": "b2",
    "title": "Some text",
    "type": "button",
    "value": "b2",
    "disabled": true
}).appendTo(con);


var detected = $("input:disabled[title]");
console.log(detected);

Using jQuery is acceptable.

Answer 1

Well, there is no feature detection for this (afaik). But you might want to workaround this issue with a transparent div overlay.

Example: http://jsfiddle.net/xQyBR/19/

Example with plugin: http://jsfiddle.net/xQyBR/24/

That way, it'll be cross-browser compatible anyway.