How display title attribute on mobile?


<a title="This is a test." href="#">

Is there not have a standard for display title message on tap elements? Or just how to hide on desktop if use it? I mean set css for [title] and style it but then show both tooltip? Browser based and css based ones. Any idea?


As it’s entirely dependent on the user agent (ie the browser being used), you are completely at the mercy of how a particular vendor decided to implement it, which means generally you need a pointing device (a mouse) to use it as a tooltip. It isn’t, as far as I know, exposed for keyboard or touch on any browser. From the W3C recommendations:

Warning! Relying on the title attribute is currently discouraged as many user agents do not expose the attribute in an accessible manner as required by this specification (e.g. requiring a pointing device such as a mouse to cause a tooltip to appear, which excludes keyboard-only users and touch-only users, such as anyone with a modern phone or tablet).

You would normally use JS if you want a tooltip, though there are fairly good HTML/CSS-only solutions of you Google around.

To hide it is very simple: just don’t use title

1 Like